JavaScript禁止默认页面滑动
我们在用 JavaScript 做一些页面特效的时候,为了适配移动端的操作方式,可能会需要制作一些滑动的效果。但是现在很多移动端浏览器都支持一些滑屏手势,比如滑动屏幕前进后退,以及滚动条等等。这样就会引起冲突,使我们做的效果不能如愿实现。
就如我最近写了个2048小游戏,需要滑动来移动数字方块,但是上滑下滑却滑动了滚动条,左右滑又变成了前进后退,简直不能愉快的玩游戏!!!!
但是我们通过 JavaScript 禁止浏览器默认的一些滑动效果。
只需要在页面就绪事件中插入以下代码:
var mo=function(event){
if (event.cancelable) {
// 判断默认行为是否已经被禁用
if (!event.defaultPrevented) {
event.preventDefault();
}
}
}
function stop(){
document.addEventListener("touchmove",mo,false);//禁止页面滑动
}
stop();
另外,上面代码中,判断默认行为是否已经被禁用是有必要的,如果不判断,直接就写 event.preventDefault();
的话,会有如下报错出现,虽然没什么太大影响,但是对强迫症来说有报错着实很难受。
[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive.
See
本作品采用 知识共享署名-相同方式共享 4.0 国际许可协议 进行许可。
Canada Online Pharmacy Propecia noppeplezeta [url=https://bansocialism.com/]purchase cialis online cheap[/url] duttSork Kamagra Sun