title: Fadeout animation happens much later than intended
body: <p>I want to change the opacity of an element while scrolling, then change it back once scrolling has stopped. This is my code:</p>
  
  <pre><code>$(window).scroll(function() {
      $(".BGlogoCircle").fadeTo( "fast", 1);
      console.log("scrolled");
      clearTimeout($.data(this, 'scrollTimer'));
      $.data(this, 'scrollTimer', setTimeout(function() {
          $(".BGlogoCircle").fadeTo("fast", 0.5);
          console.log("stopped");
      }, 250));
  });
  </code></pre>
  
  <p>It only half-works, as the first part works fine: I scroll, the element fades in, and <code>console.log('scrolled')</code> fires. </p>
  
  <p>As soon as I stop scrolling, <code>console.log("stopped")</code> fires, but then the element only fades out much later (around 5 seconds or so, I reckon).</p>
  
  <p>Where is my mistake and how can I fix this?</p>