layer.open弹层查看缩略图的原图,自适应大小的实例


Posted in Javascript onSeptember 05, 2019

很多时候需要查看缩略图的原图,那么layer.open是一个不错的选择

直接上代码

//查看原图
 function showImg(url){
 //alert(url);
 var img_infor = "<img src='" + url + "' />";
 layer.open({  
     type: 1, 
     closeBtn: 1,
     shade: false,  
     title: false, //不显示标题
     //skin: 'layui-layer-nobg', //没有背景色
     shadeClose: false,
     area:['auto','auto'],  
     //area: [img.width + 'px', img.height+'px'],  
     content: img_infor //捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响  
     //cancel: function () {  
       //layer.msg('图片查看结束!', { time: 5000, icon: 6 });  
     //}  
   });  

 }

前提是要知道img的src

好了,ok!

以上这篇layer.open弹层查看缩略图的原图,自适应大小的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ExtJs grid行 右键菜单的两种方法
Jun 19 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
May 19 Javascript
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br
Feb 27 Javascript
编写针对IE的JS代码两种编写方法
Jan 30 Javascript
jQuery弹出(alert)select选择的值
Apr 21 Javascript
JS实现同一个网页布局滑动门和TAB选项卡实例
Sep 23 Javascript
jQuery 判断是否包含在数组中Array[]的方法
Aug 03 Javascript
JavaScript控制浏览器全屏显示简单示例
Jul 05 Javascript
js实现按钮开关单机下拉菜单效果
Nov 22 Javascript
Vue核心概念Action的总结
Jan 18 Javascript
layui.tree组件的使用以及搜索节点功能的实现
Sep 26 Javascript
JS常用跨域方法实现原理解析
Dec 09 Javascript
JavaScript基础之this和箭头函数详析
Sep 05 #Javascript
layer.js open 隐藏滚动条的例子
Sep 05 #Javascript
Layui数据表格跳转到指定页的实现方法
Sep 05 #Javascript
使用easyui从servlet传递json数据到前端页面的两种方法
Sep 05 #Javascript
BootStrap表单验证中的非Submit类型按钮点击时触发验证的坑
Sep 05 #Javascript
利用d3.js制作连线动画图与编辑器的方法实例
Sep 05 #Javascript
javascript之分片上传,断点续传的实际项目实现详解
Sep 05 #Javascript
You might like
人族 Terran 基本策略
2020/03/14 星际争霸
zend framework框架中url大小写问题解决方法
2014/08/19 PHP
destoon实现VIP排名一直在前面排序的方法
2014/08/21 PHP
PHP获取数组最后一个值的2种方法
2015/01/21 PHP
浅谈PHP无限极分类原理
2019/03/14 PHP
php操作redis命令及代码实例大全
2020/11/19 PHP
JavaScript中获取元素索引的函数
2010/09/10 Javascript
DOM 中的事件处理介绍
2012/01/18 Javascript
在页面上用action传递参数到后台出现乱码的解决方法
2013/12/31 Javascript
JQuery文本改变触发事件如聚焦事件、失焦事件
2014/01/15 Javascript
为jQuery添加Webkit的触摸的方法分享
2014/02/02 Javascript
12306验证码破解思路分享
2015/03/25 Javascript
javascript实现简易计算器的代码
2016/05/31 Javascript
jQuery 判断是否包含在数组中Array[]的方法
2016/08/03 Javascript
vuejs父子组件之间数据交互详解
2017/08/09 Javascript
JavaScript 中使用 Generator的方法
2017/12/29 Javascript
基于VUE移动音乐WEBAPP跨域请求失败的解决方法
2018/01/16 Javascript
vue iView 上传组件之手动上传功能
2018/03/16 Javascript
Vue2.5学习笔记之如何在项目中使用和配置Vue
2018/09/26 Javascript
详解IOS微信上Vue单页面应用JSSDK签名失败解决方案
2018/11/14 Javascript
vue.js实现只能输入数字的输入框
2019/10/19 Javascript
Python里隐藏的“禅”
2014/06/16 Python
Python使用正则匹配实现抓图代码分享
2015/04/02 Python
python获取外网IP并发邮件的实现方法
2017/10/01 Python
Django实现表单验证
2018/09/08 Python
python使用sessions模拟登录淘宝的方式
2019/08/16 Python
详解css3 mask遮罩实现一些特效
2018/10/24 HTML / CSS
一套Delphi的笔试题一
2016/02/14 面试题
信息技术专业大学生个人的自我评价
2013/10/05 职场文书
应届生船舶驾驶求职信
2013/10/19 职场文书
初中生三年学习生活的自我评价
2013/11/03 职场文书
中学门卫岗位职责
2013/12/26 职场文书
市场营销专业求职信
2014/06/17 职场文书
群众路线教育实践活动方案
2014/10/31 职场文书
Spring this调用当前类方法无法拦截的示例代码
2022/03/20 Java/Android
Go gorilla securecookie库的安装使用详解
2022/08/14 Golang