title: How to add stop and start function for this marquee jquery
body: <p><a href="http://jsfiddle.net/gkTWC/1256/" rel="nofollow">http://jsfiddle.net/gkTWC/1256/</a></p>
  
  <p>An example that has been made.</p>
  
  <p>Basically , the javascript </p>
  
  <pre><code>$(document).ready(function() {
      var i = 0;
      $(".marqueeElement").each(function() {
            var $this = $(this);
            $this.css("top", i);
            i += 60;
            doScroll($this);
      });
  });
  
      function doScroll($ele) {
          var top = parseInt($ele.css("top"));
          if(top &lt; -50) {
              top = 180;
              $ele.css("top", top);
          }
          $ele.animate({ top: (parseInt(top)-60) },600,'linear', function() {doScroll($(this))});
      }
  </code></pre>
  
  <p>and html markup</p>
  
  <pre><code>&lt;div id="mholder"&gt;
      &lt;div class="marqueeElement"&gt;1st&lt;/div&gt;
      &lt;div class="marqueeElement"&gt;2nd&lt;/div&gt;
      &lt;div class="marqueeElement"&gt;3rd&lt;/div&gt;
      &lt;div class="marqueeElement"&gt;4th&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>So it only moves up continously, now i want to make it stop on mouse enter and start on mouseleave</p>
  
  <p>I made and mouseenter event to stop it</p>
  
  <pre><code>$(".marqueeElement").mouseover(function() {
              $('.marqueeElement').stop(true);
          })
  </code></pre>
  
  <p>It works fine, but now i stuck in how to make it move again onmouseleave .</p>
  
  <p>Pls help. thankk!!!</p>