iscroll4 捕捉元素开发手机焦点图滑动效果

 1     <div id="wrapper">
 2         <div id="scroller" >
 3             <ul id="thelist">
 4                 <li><img src="img/showpic_1.jpg"/></li>
 5                 <li><img src="img/showpic_2.jpg"/></li>
 6                 <li><img src="img/showpic_3.jpg"/></li>
 7                 <li><img src="img/showpic_4.jpg"/></li>
 8                 <li><img src="img/showpic_2.jpg"/></li>
 9             </ul>
10         </div>
11     </div>

var myScroll;
            
            function loaded() {
                scallFun();
            }
            
            function scallFun(){
                myScroll = new iScroll(‘wrapper‘, {
                    snap: true,
                    momentum: false,
                    hScrollbar: false,
                    bounce: true,
                    onTouchEnd:function(){
                        if(myScroll.x <= -1280)
                        {//判断是否到最后一张图片 最后张返回第一张
                            myScroll.scrollTo(0,0,1000);
                            myScroll.destroy();
                            scallFun();
                        }
                    },
                    onScrollEnd: function () {
},
                    onScrollStart: function () {
                        console.log(myScroll.x)
                    }
                  });
            }
        
        document.addEventListener(‘DOMContentLoaded‘, loaded, false);

window.onload = function(){
    $("#wrapper").css(‘height‘,$("#scroller").height());//初始化高度
}

window.onresize = function(){
                $("#wrapper").css(‘height‘,$("#scroller").height());//自适应高度
}