h5图片点击全屏展示并左右滑动
<!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>手机端点击图片全屏预览</title> <script src="http://www.jq22.com/jquery/jquery-2.1.1.js"></script> <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> </head> <body> <div> </div> <div class="category"> <img src="1.jpg" class="pic" width="300px"> <img src="2.jpg" class="pic" width="300px"> </div> <script> // 点击查看大图 function funcReadImgInfo(){ var imgs = []; var imgObj = $(".category .pic");//这里改成相应的对象 for(var i=0; i<imgObj.length; i++){ imgs.push(imgObj.eq(i).attr('src')); imgObj.eq(i).click(function(){ var nowImgurl = $(this).attr('src'); WeixinJSBridge.invoke("imagePreview",{ "urls":imgs, "current":nowImgurl }); }); } } $(function(){ funcReadImgInfo(); }); </script> </body> </html> ———————————————— 版权声明:本文为CSDN博主「Kathy_LLi」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。 原文链接:https://blog.csdn.net/Kathy_Hui/article/details/82460590