title: Find element that's on the middle of the visible screen (viewport), on scroll
body: <p>I need to know if there is a way I can determine if a div is in the center of the screen.</p>
  <h2>HTML:</h2>
  <pre><code>&lt;div id=&quot;container&quot;&gt;
   &lt;div class=&quot;box&quot; id=&quot;box0&quot;&gt;
    text
   &lt;/div&gt;
   &lt;div class=&quot;box&quot; id=&quot;box1&quot;&gt;
    text
   &lt;/div&gt;
  
   .....
  
   &lt;div class=&quot;box&quot; id=&quot;box100&quot;&gt;
    text
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>Is there a way to determine when a div will be in the center of the visible screen, considering that the page is scrollable? So basically, when the user is scrolling down the page, the div that's in the middle of the visible screen should be selected.</p>
  <p>Thanks</p>