html – 禁用移动设备上的滚动

html – 禁用移动设备上的滚动,第1张

概述我有一个简单的 HTML页面,当我触摸div时,我们无法滚动.你可以找到这个页面 here 如果你用桌面浏览器打开这个页面,比如firefox,如果你按下div就无法滚动. 现在我想在移动设备上使用此行为,例如Android.实际上在Android上如果打开此页面,您可以在任何情况下滚动. 对不起我的例子中的颜色;) 我想你问的是如何在移动设备上禁用滚动: 您可以为touchstart和touch 我有一个简单的 HTML页面,当我触摸div时,我们无法滚动.你可以找到这个页面 here

如果你用桌面浏览器打开这个页面,比如firefox,如果你按下div就无法滚动.

现在我想在移动设备上使用此行为,例如AndroID.实际上在AndroID上如果打开此页面,您可以在任何情况下滚动.

对不起我的例子中的颜色;)

解决方法 我想你问的是如何在移动设备上禁用滚动:

您可以为touchstart和touchmove添加事件侦听器.然后,当触发这些事件时,使用Modernizr来检测浏览器是否是触摸设备.显然,并非所有移动设备都是触摸设备,并且有触摸设备具有高分辨率,因此可以随意添加或if语句.

document.addEventListener('touchstart',this.touchstart);document.addEventListener('touchmove',this.touchmove);function touchstart(e) {    e.preventDefault()}function touchmove(e) {    e.preventDefault()}

或者,只需使用Modernizr然后使用CSS:

HTML.touch body {     overflow:hidden;}

然后添加媒体查询以有效地拥有您的或语句.

总结

以上是内存溢出为你收集整理的html – 禁用移动设备上的滚动全部内容,希望文章能够帮你解决html – 禁用移动设备上的滚动所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1081556.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存