How to check scrollbar status already at the top or at the end?

Question

The scroll bar is displayed when the user sets "overflow: auto"; and the user can scroll things from top to bottom. The problem is how to check javascript / jquery when the scrollbar is below or above? So that

if (is_scrollbar_top || is_scrollbar_end) //do some thing.. 

So, is there a way or way to check this status? Thanks

Updated: Doesn't work - using jquery ui dialog

HTML:

 <div class = "dialog" id="dialog" title="Past Issues"></div> 

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; }); 

Answer 1

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!"); } }); }); 

Answer 2

Check

 if($(window).scrollTop() == 0 || $(window).scrollTop() == $(document).height()- $(window).height()) { // do something }