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

jQuery中的jQuery.fx.interval属性用于修改动画每秒运行的帧数，并以毫秒为单位更改动画的触发速率。默认值为13ms。

用法:

jQuery.fx.interval = milliseconds;

参数：此方法接受强制的单个参数毫秒。用于指定动画触发速率(以毫秒为单位)。默认值为13毫秒。

示例1:本示例使用jQuery.fx.interval属性更改动画的触发率。

<!DOCTYPE html> 
<html> 
  
<head>  
    <title> 
        jQuery jQuery.fx.interval 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.fx.interval property</h2> 
          
        <button id="toggle"> 
            Toggle div 
        </button> 
          
        <button id="interval"> 
            Run animation with less frames 
        </button> 
       
        <div class="box"></div> 
          
        <!-- Script to illustrate jQuery.fx.interval 
            property -->
        <script> 
            $(document).ready(function(){ 
                $("#toggle").on("click", function() { 
                    $("div").toggle(5000); 
                }); 
                  
                $("#interval").on("click", function() { 
                    jQuery.fx.interval = 500; 
                }); 
            }); 
        </script> 
    </center> 
</body> 
  
</html>

输出

示例2:本示例使用jQuery.fx.interval属性更改动画的触发率。

<!DOCTYPE html> 
<html> 
  
<head>  
    <title> 
        jQuery jQuery.fx.interval 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.fx.interval property</h2> 
          
        <button id="toggle"> 
            Toggle div 
        </button> 
          
        <button id="interval"> 
            Run animation with less frames 
        </button> 
       
        <div class="box"></div> 
          
        <!-- Script to illustrate jQuery.fx.interval 
            property -->
        <script> 
            $(document).ready(function(){ 
                $("#toggle").on("click", function() { 
                    $("div").toggle(500); 
                }); 
                  
                $("#interval").on("click", function() { 
                    jQuery.fx.interval = 5000; 
                }); 
            }); 
        </script> 
    </center> 
</body> 
  
</html>

输出：

相关用法

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