|
本帖最后由 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在横竖屏切换时会出现,普通滑动,横竖屏切换,也会回来起始位置!
|
|