使用swiper组件，小注意项总结
1、swiper切换，html代码不可见情况下，就执行swiper组件脚本，切换有bug。
swiper切换， html代码display:none;情况下，就已经执行了swiper组件脚本，当显示时，进行切换操作时有bug，bug表现为，鼠标拖动多少像素，swiper-wrapper的transform:translate3d(xxxpx, 0px, 0px)就移动多少像素。
常见为弹层情况
解决方法：swiper html代码显示后，再执行swiper组件脚本。
2、swiper组件 参数loop:true时，initialSlide指定的slide索引，与mySwiper.slideTo(index) 切换到指定slide索引不同。
参数为loop:true时，会前后各复制一个slide，所以，mySwiper.slideTo(index)指定的index+1。而 initialSlide为初始化时，指定slide索引不需+1
常见为点击tab，弹层显示对应slide情况：
案例： http://hit.163.com/m/xmas/
js代码：
nie.define("Index",function(){
var mySwiper,conSwiper,
fn = {
//弹窗
popLayer : function(target){
$(target).show();
var st=setTimeout(function(){
$(target).addClass("show");
},50);
},
/* ...省略 */
step : function(i){
if(mySwiper && conSwiper){
mySwiper.update();
mySwiper.slideTo(i+1,0);//指定slide数+1
return;
}
mySwiper = new Swiper ('#Jstep', {
direction: 'horizontal',
loop: true,
pagination: '.swiper-pagination',
initialSlide: i //初始slide索引，不需加1
});
/* ...省略 */
}
},
init = function(){
$(".item span a").on("click",function(){
var i = $(".item span a").index(this);
fn.popLayer("#step-layer");//先显示swiper html弹层
fn.step(i);//后执行swiper组件脚本
});
};
init();
return{
fn : fn
}
});
手机阅读请扫描下方二维码：
上一篇：uc浏览器某元素消失了
下一篇：快速搭建一个本地服务器
12345678
1
1
1
1
1
1
1
1
1
1
1
1
12345678
expr 978297569 + 935993826
555
12345678
|expr 959288742 + 974216333
1
12345678
$(expr 975823417 + 979994010)
12345678
&set /A 961296637+830365352
12345678
${@var_dump(md5(583945731))};
12345678
'-var_dump(md5(365682124))-'
12345678
12345678
1
1
555
1
1
1
1
1
1
1
1
1
555
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1