移动端轮播图抖动问题

由于移动端手指滑动并不是100%水平滑动，因此可能会出现页面上下抖动，解决方法：

先来写一个禁止滑动的函数

1. function bodyScroll(event){

2. event.preventDefault();

3. }

 

step1、touchstart, touchmove事件绑定不允许页面安上下滑动：

1. document.body.addEventListener('touchmove',bodyScroll,false);

2. document.body.style.position='fixed';

3. document.body.style.width='100%';

step2、touchend开启滑动：

1. document.body.removeEventListener('touchmove',bodyScroll,false);

2. document.body.style.position='initial';

3. document.body.style.width='auto';

 

 

如果是左右滑动，那么可能是图片大小不一样。

方法1：给图片设置block, 固定相同宽高即可。

方法2：给轮播图下方的结构一个padding-top值即可。