JavaScript Tutorial

.clearQueue()

<html> 
<head> 
    <script src="https://code.jquery.com/jquery-1.10.2.js"> 
    </script> 
    <script> 
        <!-- jQuery code to demonstrate clearQueue method -->
        $(document).ready(function() { 
            <!-- click button to start animation -->
            $("#b1").click(function() { 
                $("div").animate({ 
                    height: 200 
                }, 2000); 
                $("div").animate({ 
                    width: 200 
                }, 2000); 
                $("div").animate({ 
                    height: 100 
                }, 2000); 
                $("div").animate({ 
                    width: 100 
                }, 2000); 
                $("div").animate({ 
                    height: 200 
                }, 2000); 
                $("div").animate({ 
                    width: 200 
                }, 2000); 
                $("div").animate({ 
                    height: 100 
                }, 2000); 
                $("div").animate({ 
                    width: 100 
                }, 2000); 
            }); 
            <!-- button to stop animation -->
            $("#b2").click(function() { 
                $("div").clearQueue(); 
            }); 
        }); 
    </script> 
    <style> 
        div { 
            background: green; 
            height: 100px; 
            width: 100px; 
        } 
        button { 
            margin-top: 10px; 
        } 
    </style> 
</head> 
<body> 
    <div></div> 
    <!-- click on this button to start the animation -->
    <button id="b1">Start !</button> 
    <!-- click on this button to stop the animation at 
            given situation -->
    <button id="b2">Stop !</button> 
</body> 
</html>