title: Continuous animation on hover (performance)
body: <p>I've created a jQuery function that scrolls a DIV by decreasing the left-margin of the element. It works, but it's incredibly slow. It eats up 100% CPU in no time :s</p>
  
  <pre><code>$(".scroll").hover(
      function () {
          var scroll_offset = parseInt($('#content').css('margin-left'));
          sliderInt = self.setInterval(function(){
              $content.css({'margin-left':scroll_offset+'px'});
              scroll_offset--;
          },8);
      }, 
      function () {
          clearInterval(sliderInt);
      }
  );
  </code></pre>
  
  <p>Obviously I am running this function every 8ms, which is asking a lot. I'm already cacheing my selectors, so I don't know what I can do to improve performance. Am I just going about it the wrong way?</p>