非微信图文网页在微信中点击放大滑动浏览

在微信图文网页中，当点击图片时会放大图片并支持滑动浏览，那么，非微信图文在微信中浏览时，当点击图片后，怎么才能达到这种效果了？好在微信公众号的js-sdk中提供了图片预览接口：

wx.previewImage({
    current: '', // 当前显示图片的http链接
    urls: [] // 需要预览的图片http链接列表
});

1.为了简化代码，首先引入jq（此处省略），第一步则是获取图片, obj为图片容器，例入("wraper img")。

        function getImg(obj){
            var m = [];
            for(var i=0; i< obj.length; i++){
                m[i] = obj[i].src;
            }
            
            return m;
        }

2.新建函数preview，用来调用微信图片预览接口，代码如下：

                function preview(current, urls){
                    if(!current || urls.length == 0){
                        return ;
                    }
                    WeixinJSBridge.invoke('imagePreview', { 
                        'current': current,
                        'urls': urls
                    });
                }

3.新建点击图片的函数img_click;其意义是当点击图片时，把所有要显示的图片存入数组并且传递给js-sdk的图片预览接口，然后放大显示图片，代码如下：

        function imgClick(obj){
            $(obj).click(function(){
                var src = getImg(obj);
                var curent = $(this).index();
                preview(src[curent], src);
            });
        }

4.最后当调用执行imgClick即可