title: jquery and stop()
body: <p>Hello I still don't get how stop() works. It stops all current animations on the object right? How can I reset all the status too and do the next animation? It happens that if you have a fade in/fade out on mouse over/out if you do it fast it happens that the animation stops at half the fade Out and the next time the object won't even show anymore</p>
  
  <pre><code>        //show delete link on hover
      $('li.dir').live('mouseover mouseout', function(event) {
            if (event.type == 'mouseover') {
              $(this ).find("span.delete_file").delay(800).fadeIn('fast');
            }
             else{
              $(this).find("span.delete_file").fadeOut('fast');
            }
      });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;li class="dir" title=""&gt;
                      &lt;span class="pin"&gt;&lt;/span&gt;
                      &lt;span  class="name"&gt;test&lt;/span&gt; 
                      &lt;span class="delete_file" title="/test"&gt;&lt;/span&gt;
                          &lt;ul class="sub_folder"&gt;
                          &lt;/ul&gt;
  
                  &lt;/li&gt;
  </code></pre>
  
  <p>How and where should I put stop() so that when I go over the li.dir the .delete_file fades In but in the same time the mouse out stops everything! It tried to play with stop() show() hide() but it always happens that if I move the mouse over and out very fast the animation "fadeIN" restarts from the last setting, which can be anything from 100%  to 0% opacity (not showing at all)</p>