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>

相关推荐
失眠的咕噜15 小时前
PDA 安卓设备上传多张图片
android·前端·javascript
掰头战士15 小时前
深入了解JS原型及原型继承链机制
javascript
贵州数擎科技有限公司15 小时前
霓虹沙尘暴的 Three.js 实现
前端·webgl
一只叁木Meow15 小时前
电商 SKU 选择器:用算法实现优雅的用户交互
前端·javascript·算法
笔优站长15 小时前
vue-sign-canvas v2 重构复盘:从 Vue 2 签名板到 Vue 3 + TypeScript 组件库
前端·vue.js
Aolith15 小时前
事件驱动设计:我如何为校园论坛实现消息通知功能
前端·vue.js
代码煮茶15 小时前
Vue3 Mock 数据实战 | 用 Mockjs + vite-plugin-mock 搭建前端独立开发环境
javascript·vue.js
JieE21215 小时前
反转链表:从双指针到递归,吃透链表反转的核心逻辑
javascript·算法
yingyima15 小时前
GitHub Actions 定时任务 schedule 踩坑实录:核心语法与实战技巧
前端
代码煮茶15 小时前
CSS 单位完全指南:px、em、rem、vw、vh、clamp 详解
前端·css