javascript 页面到达某个点后停止页面滚动
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10484314/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Stop page scroll after the page reaches certain point
提问by user1184100
How can scroll be prevented after scrollTop reaches certain value say 150.
在 scrollTop 达到特定值(例如 150)后如何防止滚动。
$(window).scroll(function() {
if($(window).scrollTop() >=50)) {
return false; // basically don't scroll
}
});
回答by Selvakumar Arumugam
the .scrollTop
set the scrollHeight using scrollTo
function. It doesn't scroll from x to y, It just goes to y.
在.scrollTop
使用设置scrollHeight属性scrollTo
功能。它不会从 x 滚动到 y,它只是转到 y。
So basically you cannot stop the scroll as your event will be called after it is set to y. You can probably set the desired scrollHeight
inside the handler after comparing the height.
所以基本上你不能停止滚动,因为你的事件将在设置为 y 后被调用。scrollHeight
比较高度后,您可能可以在处理程序内部设置所需的值。
if($(window).scrollTop() >=50)
{
$(window).scrollTop(0);
}
Note:using it on an element is bearable, but on window object will be annoying to the user. Above is just to show how it works.
注意:在元素上使用它是可以忍受的,但在 window 对象上会令用户感到厌烦。以上只是为了展示它是如何工作的。
Try scrolling in >> http://jsfiddle.net/KwgMj<< and see how annoying it can be.
尝试在 >> http://jsfiddle.net/KwgMj<< 中滚动,看看它有多烦人。
回答by undefined
$(window).scroll(function(e) {
if($(window).scrollTop() >=50)) {
$(window).scrollTop(50)
}
});
回答by Robin Castlin
Apart from the obvious question; why would you want this?
除了明显的问题;你为什么要这个?
I would suggest another approach.
我会建议另一种方法。
Have a wrapper which fills the entire window, have a certain height and use overflow-x: hidden
in css.
有一个填充整个窗口的包装器,具有一定的高度并overflow-x: hidden
在 css 中使用。
This may and may not be what you're after though.
不过,这可能是也可能不是您所追求的。
If you wish to make a continuing site that allows you to keep scrolling for the next step, I'd suggest you to simply .slideDown()
relevant content.
如果您希望创建一个允许您继续滚动下一步的持续站点,我建议您只使用.slideDown()
相关内容。
The scroll is a really basic function which shouldn't be modified with for no good reason.
滚动是一个非常基本的功能,不应无缘无故地修改。
EDIT:
For a ipad specific solution, use a wrapper:
编辑:
对于特定于 ipad 的解决方案,请使用包装器:
<? if (strpos($_SERVER['HTTP_USER_AGENT'],'iPad')): ?>
<!-- If iPad, add style -->
<style type="text/css">
div#wrapper {
height: 100%;
overflow: hidden;
}
</style>
<? endif; ?>
<body>
<div id="wrapper">
<!-- Content here -->
</div>
</body>