阻止移动端H5开发浏览器默认左右滑动行为的办法有两个:
1. css属性touch-action进行控制。
html{ touch-action:none; touch-action:pan-y; }
2. 使用js监听touch事件,使用event.preventDefault()阻止浏览器的默认行为。
var startX,startY; document.addEventListener("touchstart",function(e){ startX = e.targetTouches[0].pageX; startY = e.targetTouches[0].pageY; }); document.addEventListener("touchmove",function(e){ var moveX = e.targetTouches[0].pageX; var moveY = e.targetTouches[0].pageY; if(Math.abs(moveX-startX)>Math.abs(moveY-startY)){ e.preventDefault(); } },{passive:false});
Copyright © 2021 .长沙麦涛网络科技有限公司 All rights reserved. 湘ICP备20015126号-2 联系我们