Javascript Scroll event

Question

On some blogs, when you scroll towards the bottom of the page they will have a DIV that slides into view in the bottom right corner of the page.

A lot of times on a blog article, onces you get down the page to about the point where the Comment section starts is where they will have this DIV slide into view.

I am trying to replicate this, I saw one site that does it but it doesn't do it near the comments instead it uses this code below which you can see is around the half way point.

Document height - the Window height / 2

So it's actually left then half way down the page. How would I go about having it come into view when I get to the comment section of the page, let's say my comments are wrapped in a DIV with the ID comments

$(document).scroll(function () {
    var curPos = $(document).scrollTop();
    var docHeight = $(document).height() - $(window).height();
    if (curPos > (docHeight / 2)) {
      MoneyBox.show();
    } else {
      MoneyBox.hide();
    }
});

Answer 1

Try comparing the scrollTop and the offset of your div

$(document).scroll(function(){
    var curPos = $(document).scrollTop();

    var commentsPos = $('#comments').offset().top;

    if(curPos >= commentsPos) {
        MoneyBox.show();
    } else {
        MoneyBox.hide();
    }
});