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。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。