我正在开发一个基于iPad的网络应用程序,需要防止过度滚动,以免它看起来像网页.我目前正在使用它来冻结视口并禁用过度滚动:
document.body.addEventListener('touchmove',function(e){
e.preventDefault();
});
这可以很好地禁用过度滚动,但我的应用程序有几个可滚动的div,上面的代码阻止它们滚动.
我只针对iOS 5及以上版本,所以我避免使用像iScroll这样的hacky解决方案.相反,我将这个CSS用于我的可滚动div:
.scrollable {
-webkit-overflow-scrolling: touch;
overflow-y:auto;
}
这没有文档overscroll脚本,但不解决div滚动问题.
没有jQuery插件,有没有办法使用过度滚动修复但免除我的$('.scrollable')divs？
编辑:
我发现了一些不错的解决方案:
// Disable overscroll / viewport moving on everything but scrollable divs
$('body').on('touchmove', function (e) {
if (!$('.scrollable').has($(e.target)).length) e.preventDefault();
});
滚动浏览div的开头或结尾时,视口仍会移动.我想找到一种方法来禁用它.
有没有办法在iPhone网络应用程序中完全禁用网页滚动？我在谷歌上试过很多东西,但似乎都没有用.
这是我当前的标题设置:
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
document.body.addEventListener('touchmove', function(e){ e.preventDefault(); });
似乎不起作用.
是的我知道.这个问题之前已被问过一千次.感谢所有人,我能够找到一个解决方案,最终在<= iOS7中完成了我的工作.但是,在更新到iOS 8后 - 似乎没有任何效果!
在iOS7中对我来说非常有用
CSS
html, body, .scrollable {
overflow: auto;
-webkit-overflow-scrolling: touch;
}
jQuery的
$(function() {
$(document).on("touchmove", function(evt) { evt.preventDefault() });
$(document).on("touchmove", ".scrollable", function(evt) { evt.stopPropagation() });
});
我试过的其他解决方案:
全部在这里:iPhone Web App - 停止正文滚动
在这里:iOS Safari - 如何禁用过度滚动但允许可滚动的div正常滚动？
和更多 ...
那么,有没有人知道iOS8兼容的禁用身体界限滚动 /反弹效果的方式(除了应用于phonegap项目的原生解决方案)？
如何防止Safari iOS中的过度滚动？我会使用触摸手势在网站上导航,但我不能.
我试过这个:
$(window).on('touchstart', function(event) {
event.preventDefault();
});
但是通过这种方式我禁用了所有手势,事实上我无法通过捏合和捏合来缩放.
有解决方案吗 谢谢.
我正在创建一个网络应用程序（主要集中在 Chrome 中的使用），但是 Chrome 的“平滑滚动”（我想这就是所谓的，像 IOS 上的“额外”滚动）（在 mac 上时）进入道路。
有没有办法通过javascript禁用它？