jQuery jQuery.fx.off Property
Last Updated :
11 Jul, 2023
The jQuery.fx.off property in jQuery is used to globally disable/enable all animations. Its default value is false which is used to allow animation to run normally.
Syntax:
jQuery.fx.off = true|false;
Parameter: This event accepts two parameters as mentioned above and described below:
- true: It is used to specify that the animations should be disabled.
- false: It is used to specifies that the animations should be enabled.
Example: This example uses jQuery.fx.off property to disable the animation.
html
<!DOCTYPE html>
< html >
< head >
< title >
jQuery jQuery.fx.off property
</ title >
< script src =
</ script >
< style >
.box {
background: green;
height: 100px;
width: 100px;
margin: 50px;
}
</ style >
</ head >
< body >
< center >
< h1 style = "color:green;" >
GeeksForGeeks
</ h1 >
< h2 > jQuery.jQuery.fx.off property</ h2 >
< button id = "disable" >
jQuery.fx.off = true ( Disable )
</ button >
< br >< br >
< button id = "toggle" >
Toggle animation
</ button >
< div class = "box" ></ div >
< script >
$(document).ready(function () {
$("#disable").click(function () {
jQuery.fx.off = true;
});
$("#toggle").click(function () {
$("div").toggle("slow");
});
});
</ script >
</ center >
</ body >
</ html >
|
Output:
Example 2:This example uses jQuery.fx.off property to disable and enable animation.
html
<!DOCTYPE html>
< html >
< head >
< title >
jQuery.jQuery.fx.off property
</ title >
< script src =
</ script >
< style >
.box {
background: green;
height: 100px;
width: 100px;
margin: 50px;
}
</ style >
</ head >
< body >
< center >
< h1 style = "color:green;" >
GeeksForGeeks
</ h1 >
< h2 >jQuery.jQuery.fx.off property</ h2 >
< button id = "disable" >
jQuery.fx.off = true ( Disable )
</ button >
< button id = "enable" >
jQuery.fx.off = false ( Enable )
</ button >
< br >< br >
< button id = "toggle" >
Toggle animation
</ button >
< div class = "box" ></ div >
< script >
$(document).ready(function () {
$("#disable").click(function () {
jQuery.fx.off = true;
});
$("#enable").click(function () {
jQuery.fx.off = false;
});
$("#toggle").click(function () {
$("div").toggle("slow");
});
});
</ script >
</ center >
</ body >
</ html >
|
Output:
Share your thoughts in the comments
Please Login to comment...