Javascript 使用 jQuery 获取滚动底部
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12797224/
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
Getting the scrollbottom using jQuery
提问by Cameron
I have the following code which gets the amount the user has scrolled from the top and the bottom and then using these values it should hide or show the shadows.
我有以下代码，它获取用户从顶部和底部滚动的数量，然后使用这些值应该隐藏或显示阴影。
$(document).ready(function() {
if ( $(window).scrollTop() + $(window).height() >= $(window).height() ) {
$('div.shadow-bottom').show();
}
$(window).scroll(function () {
if ( $(window).scrollTop() >= 15 ) {
$('div.shadow-top').show();
} else {
$('div.shadow-top').hide();
}
if ( $(window).scrollTop() + $(window).height() >= $(window).height() - 15 ) {
$('div.shadow-bottom').show();
} else {
$('div.shadow-bottom').hide();
}
});
});
The top works fine, but the bottom one should be hiding when you get to the bottom of the page BUT then show again if you are 15 pixels from the bottom.
顶部工作正常，但是当您到达页面底部时，底部应该隐藏，但是如果距离底部 15 个像素，则再次显示。
Example: http://dev.driz.co.uk/shadow/
回答by bhb
$(window).height(); // returns height of browser viewport
$(window).height(); // 返回浏览器视口的高度
$(document).height(); // returns height of HTML document
$(文档).height(); // 返回 HTML 文档的高度
Change your code to:
将您的代码更改为：
$(document).ready(function() {
if ($(window).scrollTop() + $(window).height() >= $(document).height() - 15) {
$('div.shadow-bottom').show();
}
$(window).scroll(function() {
if ($(window).scrollTop() >= 15) {
$('div.shadow-top').show();
} else {
$('div.shadow-top').hide();
}
if ($(window).scrollTop() + $(window).height() >= $(document).height() - 15) {
$('div.shadow-bottom').show();
} else {
$('div.shadow-bottom').hide();
}
});
});?
回答by Cameron
The correct working example is:
正确的工作示例是：
$(document).ready(function() {
if ($(window).height() < $(document).height()) {
$('div.shadow-bottom').show();
}
$(window).scroll(function() {
if ($(window).scrollTop() >= 15) {
$('div.shadow-top').show();
} else {
$('div.shadow-top').hide();
}
if ($(window).scrollTop() + $(window).height() >= $(document).height() - 15) {
$('div.shadow-bottom').hide();
} else {
$('div.shadow-bottom').show();
}
});
});
Which is based on bhb's answer above.
这是基于 bhb 上面的回答。
