Run script when div is visible in browser window
<p>I need to run some JavaScript when a <code>div</code> is visible in the browser window, for example, when it is scrolled to, even repeatedly. How would I go about doing so? </p>

<p>Basic structure: </p>

<pre><code>&lt;div class='page1'&gt;&lt;/div&gt;

&lt;div class='page2'&gt;&lt;/div&gt;

&lt;div class='page3'&gt;&lt;/div&gt;

&lt;div class='page4'&gt;&lt;/div&gt;
</code></pre>

<p>CSS:</p>

<pre><code>div {
    float: left;
    height: 500px;
    width: 500px;
    margin: 50px 0;
    background: grey;
}
</code></pre>

<p>Fiddle: <a href="http://jsfiddle.net/Q5BUe/1/" rel="nofollow">http://jsfiddle.net/Q5BUe/1/</a></p>
