title: Add delay when updating text on scroll change
body: <pre><code>function updateImageInfo() {
      var center = Math.floor(($(window).height() / 2)) + $(window).scrollTop();
      $('.mainimages').each(function(i, img) { 
          var top = $(img).offset().top;
          if(top &lt;= center &amp;&amp; top + $(img).height() &gt;= center) {
              if($('#imgwrap').data('currentImageId') != $(img).data('info').internal_id) {
                  $('#infotext').text($(img).data('info').misc.name);
              }
              $('#imgwrap').data({ 'currentImageId' : $(img).data('info').internal_id });
          }
      }); 
  }
  </code></pre>
  
  <hr>
  
  <pre><code>$(window).scroll(function () { 
      updateImageInfo();
  });
  </code></pre>
  
  <p>What i would like to do is to add a delay when the text gets updated, <code>$('#infotext').text($(img).data('info').misc.name);</code> and add some kind of animation like fadeIn and fadeOut when the text changes. </p>
  
  <p>I've tried wrapping it with a <code>setTimeout()</code>, but if you scroll a lot up and down a lot, the text changes queue up. I think <code>proxy()</code> can be used to achieve this, but im not sure how to use it.</p>
  
  <p>Live code: <a href="http://johanberntsson.se/dev/fotosida/" rel="nofollow">http://johanberntsson.se/dev/fotosida/</a></p>
  
  <p>Thanks</p>