Blogger Information
Blog 17
fans 0
comment 0
visits 23115
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
layer弹出图片
飞鸿先森的博客
Original
2532 people have browsed it

layer弹出层非常之好用,用户体验非常好,有这样一个需求,当点击指定文字或是缩略图后,使用layer弹出原图片,并且弹出层的宽和高根据图片大小自动变化。下面是实现这一功能的代码。

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

如果想要规定弹出层的宽高,将属性area设置即可如弹出层宽800px,高600px,可写成area['800px','600px']

Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post