Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

How to disable jQuery animation ?

  • Last Updated : 06 Sep, 2021

In this article, we will see how to disable the animation effect using jQuery. To disable the animation effect, we use property.

The property is used to globally enable/disable all animations of a page. Its default value is false which is used to allow animation to run normally.

Syntax: = true|false;

Property Values: 

  • true: It is used to specify that the animations should be disabled.
  • false: It is used to specifies that the animations should be enabled.


Approach: Here, first we will use div element to create a square box of size 100px. After creating the box, we use toggle() method to set the toggle animation on the <div> element. Also, we use property to disable the toggle animation effect.



<!DOCTYPE html>
        How to disable jQuery animation?
    <script src=
        .box {
            background: green;
            height: 100px;
            width: 100px;
            margin: 50px;
        <h1 style="color:green;">
        <h2>Disable jQuery Animation</h2>
        <button id="disable">
            Disable the Animation
        <button id="toggle">
            Toggle Animation
        <div class="box"></div>
            $(document).ready(function() {
                $("#disable").click(function() {
           = true;
                $("#toggle").click(function() {


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!