layui 可以使点击图片放大

layui可以使图片点击放大,不用在写jquyery了真是很方便。

操作示例

引入

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/layui-layer@3.1.1/dist/layui.css" />

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/layui-layer@3.1.1/dist/layui.js"></script>

//创建容器

<div id="warranty_image">

@@##@@

</div>

<script>

layui.use(['form', 'table'], function () {

var $ = layui.jquery,

form = layui.form,

table = layui.table;

$("#warranty_image").click(function () {

layer.photos({

photos: {

data: [

{

src: $(this).attr("src")

}

]

},

shade: 0.7

});

})

});

</script>

相关推荐
Yeh2020581 分钟前
request与response笔记
java·前端·笔记
像我这样帅的人丶你还7 分钟前
前端监控体系与实践:从错误上报到内存与 GC 观测
前端·javascript·架构
前端毕业班15 分钟前
uni-app 小程序主包瘦身指南 - 分包 node_modules
前端
LinDaiDai_霖呆呆24 分钟前
我用 Claude Code 一天搭了个高扩展性的 Web 3D 编辑器 SDK,但最有价值的不是代码 🔥
前端·ai编程·claude
AZaLEan__25 分钟前
Flex 弹性布局学习总结
前端·css·css3
a11177626 分钟前
高斯泼溅 (Gaussian Splatting) 的 Three.js 实现
开发语言·javascript·ecmascript
代码北人生33 分钟前
agent时代,我们都低估了这个 23k Star 的 Claude Code Skills 项目!
javascript
成都渲染101云渲染666634 分钟前
云渲染全面支持3dsMax 2027,高效渲染体验升级
开发语言·前端·javascript
卸任36 分钟前
别用Quill了,打造自己的Tiptap富文本编辑器
前端·react.js
陈广亮38 分钟前
React 图表库选型指南:Recharts、ECharts、Nivo、Lightweight Charts 深度对比
前端