How to detect when the user has scrolled to a certain area on the page using jQuery?
<blockquote>
  <p><strong>Possible Duplicate:</strong><br>
  <a href="http://stackoverflow.com/questions/5036850/how-to-detect-page-scroll-to-a-certain-point-in-jquery">How to detect page scroll to a certain point in jQuery?</a>
  <br> <a href="http://stackoverflow.com/questions/487073/jquery-check-if-element-is-visible-after-scroling">jQuery - Check if element is visible after scroling</a>  </p>
</blockquote>



<p>How can I detect when the user has reached this div:</p>

<pre><code>&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;

&lt;div id="theTarget"&gt;I have been reached&lt;/div&gt;
</code></pre>

<h2>EDIT</h2>

<p>Got the answer from this question:</p>

<p><a href="http://stackoverflow.com/questions/487073/jquery-check-if-element-is-visible-after-scroling">jQuery - Check if element is visible after scroling</a></p>

<p>So I just did this:</p>

<pre><code>function isScrolledIntoView(elem)
{
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();
    var elemTop = $(elem).offset().top;
    var elemBottom = elemTop + $(elem).height();
    return ((elemBottom &gt;= docViewTop) &amp;&amp; (elemTop &lt;= docViewBottom) &amp;&amp; (elemBottom &lt;= docViewBottom) &amp;&amp; (elemTop &gt;= docViewTop));
}

$(window).scroll(function() {    
    if(isScrolledIntoView($('#theTarget')))
    {
        alert('visible');
    }    
});
</code></pre>
