title: Animate background of submit button on press?
body: <p>I'm trying to animate a button on submit.</p>
  
  <p>I have the following html:</p>
  
  <pre><code>&lt;input id="save" val="save" /&gt;
  </code></pre>
  
  <p>and css:</p>
  
  <pre><code>#save { background: #ccc; }
  
  .saving { background: #ccc url(/img/savingstripes.png) repeat; }
  </code></pre>
  
  <p>and jquery:</p>
  
  <pre><code>$('#save').click(function(e) { 
  
    e.preventDefault();
  
    $(this).addClass('saving').animate({backgroundPosition: '100px 0px'});
  
  })
  </code></pre>
  
  <p>When I press this button, all I get is the class 'saving' added to the button but no animation.</p>
  
  <p>What am I missing in this? (Note: I have the <a href="http://plugins.jquery.com/project/backgroundPosition-Effect" rel="nofollow">backgroundPosition plugin</a>) </p>