JQuery jQuery.fx.off用法及代码示例

jQuery中的jQuery.fx.off属性用于全局禁用/启用所有动画。其默认值为false，用于允许动画正常运行。

用法:

jQuery.fx.off = true|false;

参数：此事件接受上述和以下描述的两个参数：

true:用于指定应禁用动画。
false:它用于指定应启用动画。

例：本示例使用jQuery.fx.off属性禁用动画。

<!DOCTYPE html> 
<html> 
  
<head>  
    <title> 
        jQuery jQuery.fx.off property 
    </title> 
      
    <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
    </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 to use jQuery.fx.off property -->
        <script> 
            $(document).ready(function() { 
                $("#disable").click(function() { 
                    jQuery.fx.off = true; 
                }); 
                  
                $("#toggle").click(function() { 
                    $("div").toggle("slow"); 
                }); 
            }); 
        </script> 
    </center> 
</body> 
  
</html>

输出：
在单击禁用按钮之前：

单击禁用按钮后：

示例2:本示例使用jQuery.fx.off属性禁用和启用动画。

<!DOCTYPE html> 
<html> 
  
<head>  
    <title> 
        jQuery.jQuery.fx.off property 
    </title> 
      
    <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
    </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 to use jQuery.fx.off property -->
        <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>

输出：
同时使用“禁用”和“启用”按钮：

相关用法

注：本文由纯净天空筛选整理自SHUBHAMSINGH10大神的英文原创作品 jQuery | jQuery.fx.off Property。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。