移动端网页放大图片，调用内置图片浏览功能

注意：需要在微信中打开，请引入https://res.wx.qq.com/open/js/jweixin-1.3.2.js，文件

效果网址：http://yj.surenjiangyong.cn/imagePreview.html （请在微信中打开）

<style type="text/css">
*{margin: 0;padding:0;}
.img_div img{width: 100%;display: block;}
</style>

html：

    <div class="img_div">
        <img src="http://panpan.yunmell.wang/attachment/images/2/2019/10/UDYygid8lgdcD9CclcZ0ZzDG8nXuYb.jpg">
        <img src="http://panpan.yunmell.wang/attachment/images/2/2019/10/kHSZHrxrhSUkX3Qr8Zz5SrzRzZHh0f.jpg">
        <img src="http://panpan.yunmell.wang/attachment/images/2/2019/10/e8Jq8yKHFw4FwYY8Jp4jPhuC2k8u41.jpg">
        <img src="http://panpan.yunmell.wang/attachment/images/2/2019/10/doyuSUmCK9MOkuKtcf1E1uKtCTs5ut.jpg">
        <img src="http://panpan.yunmell.wang/attachment/images/2/2019/10/E0RzrV4QW1000Z4ttr3q0h8ndCoR0w.jpg">
    </div>

js:

<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(".img_div img").click(function(){
    var obj=$(".img_div img");
    var urlsarr=[];    
    var src=$(this).attr('src');
    var index=$(this).index();
    for(var i=0;i<obj.length;i++){
        urlsarr.push(obj.eq(i).attr('src'));
    }
    WeixinJSBridge.invoke('imagePreview', {
        current: urlsarr[index],//当前显示图片
        urls: urlsarr,//图片路径数组形式
    })
});
</script>

原文地址：https://www.cnblogs.com/Yjjhn/p/11771242.html