title: The way to stop and continue animation while mouseover and mouseout in JQuery
body: <p>E.g:</p>
  
  <p>a simple example to explain:</p>
  
  <pre><code>$('.moveDiv').animate({ "margin-left": 2000 }, 20000, 'linear');
  </code></pre>
  
  <p>the <code>moveDiv element</code> would move to left when it was loaded,and now, when the <code>mouse move over</code> the <code>moveDiv element</code>, I wish it to stop and continue to move when the <code>mouse move out</code>!</p>
  
  <p>Any ideas?</p>
  
  <p>I found this code in this <a href="https://stackoverflow.com/questions/2143056/seamless-jquery-marquee">question of stackoverflow</a>,so , I just want to modify the code to make it could stop and continue animation when mouse hover!!</p>
  
  <p><a href="http://jsbin.com/uyawi/3/edit" rel="nofollow noreferrer">the demo of the code</a></p>