title: jQuery - check if elements come into view, fade in those that do
body: <p>I have found the answer to this issue when I know which element to specify, but what I am looking for is for a way to check 'on scroll' whether ANY element with a specific class has come into view, and modify them as they do (e.g. change opacity - only those that come into view). I know the code might look something similar to this, but I can't make it work:</p>
  
  <pre><code>jQuery(window).on("scroll", function() {
  var difference = jQuery(window).offset().top + jQuery(window).height()/2;
  if (difference &gt; jQuery(".makeVisible").offset().top) {
       jQuery(this).animate({opacity: 1.0}, 500);
  
  }
  });
  </code></pre>
  
  <p>Thank you very much.
  Note: the variable difference exists because I want elements to become visible as they reach the middle of the screen.</p>