Solve the Jquery mouse over the sliding problem

There are many cases in Jquery where the hidden HTML elements are constantly displayed, especially when the mouse is over. Causes back-and-forth hiding and showing

 
<script type="text/javascript"> 
$(document).ready(function(){ 
$(".flip").click(function(){ //******** ***** the problem point is here, there is no judgment whether in the animation
$(".panel").slideToggle("slow"); 
}); 
}); 
</script> 
<style type="text/css"> 

The correct way to write it is something like this

 
<script type="text/javascript"> 
$(document).ready(function(){ 
$(".flip").click(function(){ 
if(!$(".panel").is(":animated")){ //Here's the problem, here's the problem of whether or not it's animated
$(".panel").slideToggle("slow"); 
} 
}); 
}); 
</script> 

Or stop the animation queue before sliding.

 
<script type="text/javascript"> 
$(document).ready(function(){ 
$(".flip").click(function(){ 
$(this).stop().slideToggle("slow");//The stop() function stops the animation queue.
}); 
}); 
</script>