How to disable jQuery animation

In this post, you will find a simple jQuery tip to disable all animation. jQuery provides a property "jQuery.fx.off" which when set to true, disables all the jQuery animation. But why do you want to do that?

Let's assume that you had written lots of jQuery code and you want to turn off all the jQuery animation because your client doesn't like it due to slow response on some hardware device. What will you do? Either you can find all required code and remove it but that's time consuming or you can use jQuery.fx.off property to make your life easy.

Demo

Let's say on click of a button, you want to show/hide a div.
$(document).ready(function(){
   $('#btnShow').click(function(){
       $('#dvText').toggle("slow");
   });
});
When you run this page, you will see jQuery animation while showing/hiding div.

Now you want to disable all the animations. As said earlier that jQuery provides a property "jQuery.fx.off" which when set to true, disables all the jQuery animation.
$(document).ready(function() {
   jQuery.fx.off = true;
   $('#btnShow').click(function(){
       $('#dvText').toggle("slow");
   });
});
See live Demo and Code
You can turn on the animation again by setting this property to false.

Feel free to contact me for any help related to jQuery. I will gladly help you.
SHARE

Nothing shocks me, I'm a Software Engineer. And I am not young enough to know everything. I live in World Wide Web and from there take care of this website. This website communicates about my work, learning and experience. I believe life is short, and it is for loving, sharing, learning and connecting. So lets connect..