php layer图片点击放大,利用layer弹窗插件 实现图片放大缩小功能！jquery图片放大缩小。...

利用layer弹窗插件，实现图片放大缩小功能！jquery图片放大缩小

以下是以前用到的源码，分享出来让大家参考一下！

这个兼容性挺好的，用起来简单。

HTML核心部分：

 

小川

2016-10-24 10:22:52

 

小川

2016-10-24 10:22:52

JS核心部分：

function bigIma(id){

var imgUrl = $("#itemLi_"+id).attr('data-src');

window.img_width = 355;

var html  = "

";

html += "

";

html += "  

html += "        οnclick='window.img_width 

html += "  $(\".img_url_class\").css({width: window.img_width});'>";

html += "  放大";

html += "  

    ";

html += "  

html += "  οnclick='window.img_width > 100 ? window.img_width -= 100 : 0;";

html += "  $(\".img_url_class\").css({width: window.img_width})' >";

html += "  缩小";

html += "  

";

html += "

";

html += "

";

html += "
";

html += "

";

   html += "";

html += "

";

//页面层

layer.open({

title:'原始图预览',

type: 1,

//skin: 'layui-layer-rim', //加上边框

area: ['355px', '615px'], //宽高

content: html

});

}

浏览器启用弹出窗口过滤功能，将无法跳转到下载页。在浏览器地址栏右边符号提示处点击允许就可以了！

郑重声明：

1、本站源码仅供个人学习研究和交流使用，请于下载后二十四小时内删除

2、本站大多资源来源于互联网、用户分享，仅供学习交流使用，本站不提供任何技术支持

3、本站联系方式Email：admin@youhutong.com ，收到邮件会第一时间处理。

4、如侵犯到任何版权问题，请立即告知本站(立即在线告知)，本站将及时删除并致以最深的歉意