title: Freeze hover onclick
body: <pre><code> $(".somediv").hover(
       function() {
           $(this).animate({'margin-top':'100px'},1000);
       },
       function() {
           $(this).animate...…
       }
   );
   $(".somediv").click(function ....????      
  </code></pre>
  
  <p>The question is how can I freeze the animation on click in the margin-top:100px state not letting onmouseout function to happen after somediv was clicked </p>
  
  <p>But next click should unfreeze the hover functions 
  Thanks on advance</p>
  
  <hr>
  
  <p>stop() doesn't help to prevent unhovering</p>
  
  <pre><code>$("#one.button").hover(function() {
  $(this).animate({'margin-top':'30px'},{queue:false,duration:700});
  }, function() {
  $(this).animate({'margin-top':'10px'},{queue:false,duration:700});
    });
  
  $("#one.button").click(function(){
  $("#one.button").stop().animate({'margin-left':'0px'},{queue:false, duration:700});
   });
  </code></pre>
  
  <p>after click #one.button is animated to margin-left:0px and after that it is unhovered to margin-top:10px</p>