Swiper中文论坛

标题: Swiper手机版页面，横竖屏切换的时候出现异常 [打印本页]

作者: aizhenashi 时间: 2016-4-7 17:02
标题: Swiper手机版页面，横竖屏切换的时候出现异常
本帖最后由 aizhenashi 于 2016-4-7 17:16 编辑

如题，异常状况：
   由于有多张图，用SlideTo做了跳转到指定图片，跳转完成后，前后滑动正常。但是当手机切换横竖屏时，已经滑动到其他图片的，会自动跳到slideTo的那张图。

有没有对这个有过了解的大神，给个解决思路。

部分代码如下：
跳转代码
      var mySwiper = new Swiper('.swiper-container',{
         loop:true
      });
      $("#toThePage").unbind('click').bind('click',function(){
         var pageGo = parseInt($("#pageToGo").val());
         var pageTotal = parseInt($("#totalPages").text());
         if(pageGo > pageTotal){
            //alert("请输入正确的页码！");
            TINY.box.show("请输入正确的页码！",0,0,0,0,2);
            return false;
         }
         if(pageGo < 1){
            //alert("请输入正确的页码！");
            TINY.box.show("请输入正确的页码！",0,0,0,0,2);
            return false;
         }
         if(isNaN(pageGo)){
            TINY.box.show("请输入正确的页码！",0,0,0,0,2);
            return false;
         }
         var pageImg = pageGo-1;
         var readUrl = "<?php echo $book['basePath'].$book['dirName'].'/'.$book['serial'];?>"+"-"+pageImg+".png";
         $("#getPageBg").css('display','none');
         $("#getPage").css('display','none');
         $("#nowPage").text(pageGo);
         $("#pageNow").text(pageGo);
         $("div[data-swiper-slide-index='"+pageImg+"']").find("img").attr("src",readUrl);
         mySwiper.slideTo(pageGo, 300, false);
      });

   滑动代码：
      var swiper = new Swiper('.swiper-container',{
         loop:true,
         onSlideChangeEnd: function(swiper){
               var index = parseInt($(".swiper-slide-active").attr("data-swiper-slide-index"));

            //alert(index);
            $("#nowPage").html(index+1);
            $("#pageNow").text(index+1);
            var path = "<?php echo $book['basePath'].$book['dirName'].'/'.$book['serial'];?>";
            var child = index+1;
            $("#pageToGo").val(child);
            var nextChild = index+2;
            if($("div[data-swiper-slide-index='"+index+"']")) $("div[data-swiper-slide-index='"+index+"']").find("img").attr("src",path+'-'+index+'.png');
            if($("div[data-swiper-slide-index='"+child+"']")) $("div[data-swiper-slide-index='"+child+"']").find("img").attr("src",path+'-'+child+'.png');
            if($("div[data-swiper-slide-index='"+nextChild+"']")) $("div[data-swiper-slide-index='"+nextChild+"']").find("img").attr("src",path+'-'+nextChild+'.png');
            //alert(swiper.activeIndex);
         }
      });

测试后发现，不只是SlideTo在横竖屏切换时会出现，普通滑动，横竖屏切换，也会回来起始位置！

作者: aizhenashi 时间: 2016-4-7 17:02

大神快来

欢迎光临 Swiper中文论坛 (http://bbs.swiper.com.cn/)