javascript 如何检查滚动条状态已经在顶部或底部？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14193193/
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
How to check the scroll bar status is already at top or at end?
提问by user782104
The scroll bar is shown when user set "overflow:auto;" and the user can scroll things from top to bottom. The problem is , how can the javascript/jquery check when the scroll bar is either at the bottom or at the top? So that
当用户设置“overflow:auto;”时显示滚动条 并且用户可以从上到下滚动内容。问题是，javascript/jquery 如何检查滚动条何时位于底部或顶部？以便
if (is_scrollbar_top || is_scrollbar_end)
//do some thing..
So are there any funciton/ way to check such status? Thanks
那么有什么功能/方法可以检查这种状态吗？谢谢
Updated: Not working- using jquery ui dialog
更新：不工作 - 使用 jquery ui 对话框
html:
html：
<div class = "dialog" id="dialog" title="Past Issues"></div>
javascript:
javascript:
$('#pastIssues').click(function (event) {
var issueString = 'product=Headline&year=2012&month=12';
$('.issues,#issuesBox').remove();
var dWidth = $(window).width() * 0.9;
var dHeight = $(window).height() * 0.9;
$( "#dialog" ).dialog({
height: dHeight,
width: dWidth,
modal: true,
draggable: false,
resizable: false,
});
get_past_issues(issueString,2012,12,event.type);
return false;
});
回答by Anujith
HTML:
HTML：
<div id="mydiv" style="overflow: auto; height: 500px"></div>
SCRIPT:
脚本：
$(document).ready(function()
{
$("#mydiv").scroll(function()
{
var div = $(this);
if (div[0].scrollHeight - div.scrollTop() == div.height())
{
alert("Reached the bottom!");
}
else if(div.scrollTop() == 0)
{
alert("Reached the top!");
}
});
});
回答by TechSpellBound
check
查看
if($(window).scrollTop() == 0 || $(window).scrollTop() == $(document).height()- $(window).height()) {
// do something
}
