移动端可以点击放大的图片

1，本方法是用http://jqweui.com/extends#photos里面的方法来调用的，只是做个记录

2，首先引入jq文件和css文件

css文件

<link rel="stylesheet" type="text/css" href="css/jquery-weui.css"/>

jq文件

<script type="text/javascript" src="js/jquery-2.1.4.js" ></script>

<script type="text/javascript" src="js/jquery-weui.js" ></script>

<script type="text/javascript" src="js/swiper.min.js" ></script>

js代码

<script>

//初始化代码

$(function() {

    FastClick.attach(document.body);

  });

//图片放大

      var pb1 = $.photoBrowser({

        items: [

        //图片路径

          "./img/ad_auto.jpg",

          "./img/ad_home.jpg",

          "./img/ad_nba.jpg",

          "./img/ad_stock.jpg",

          "./img/ad_yuetu.jpg",

        ],

//可翻页

        onSlideChange: function(index) {

          console.log(this, index);

        },

        onOpen: function() {

          console.log("onOpen", this);

        },

        onClose: function() {

          console.log("onClose", this);

        }

      });

      //开始显示用的是第几张，这里是第0张开始就是第一张开始

      $("#pb1").click(function() {

        pb1.open(0);

      });

</script>

html代码

<div class='demos-content-padded'>

    <a href="javascript:;" id="pb1"><img src="img/ad_auto.jpg"/></a>

  </div>

Tags：

转载：转载说明/xd/37.html

很赞哦！ ()