Question

在我的手机上运行我的应用程序/网页时，我希望页面不能垂直滚动，但我确实希望div允许垂直滚动。这是有效的，但是一旦div到达滚动的底部，它就会滚动整个页面。

用于禁用垂直页面滚动的代码：

 $(document).bind('touchmove', function (e) {
     if (!$('.scrollable').has($(e.target)).length) e.preventDefault();
});

我的div生成器可以在我想要滚动的div中追加任意数量的div：

      $('#mySelect').append("<div style = 'width:100%; height: 30%; text-align: left; background-color: white; border: 1px solid gray; line-height: 0%' >" +
     "<div style = 'float: left; margin-left: 5%'><p style = ' font-size:" +fontSize+"'>" + username + "</p><p style = 'color: gray; font-size:" +subtext+"'>" +wholeName+"</p></div>    <img style = 'float: right; padding-top: 3%; padding-right: 3%; right: 0; height: 80%;' onclick = addFriend('"+username+"') src = 'addfriend.png'></div>");

被附加到div：

 <div id="mySelect" class = "scrollable">
 </div>

因此，当我的“可滚动”div到达顶部或底部时，我需要知道如何停止垂直滚动。谢谢你的帮助。

编辑：我应该指定这是一个通过html呈现的appmobi / xdk应用程序。所以它在技术上并不是在浏览器中只是屏幕视口。

Answer 1

如果您将此css添加到文档中，那么没有什么可以垂直滚动到<？p>

html,body{height:100%;overflow-y:hidden}

这是一个小例子：http://jsfiddle.net/filever10/XEvGP/

它没有经过测试，所以如果有任何问题，请告诉我。

新方法 好的，所以这是浏览器运动...

这应该有用，如果它是ios

document.ontouchmove and scrolling on iOS 5

Answer 2

尝试添加 overscroll-behavior: contain。

div滚动到达结尾时页面滚动

2 个答案: