jQuery jQuery.fx.interval属性用法示例

2021年4月9日16:32:47 发表评论 141 次浏览

jQuery.fx.interval属性jQuery中的ins用于修改动画运行的每秒帧数, 并以毫秒为单位更改动画发射速率。默认值为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;">  
             lsbin
         </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>

输出如下

jQuery jQuery.fx.interval属性用法示例

示例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;">  
             lsbin
         </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>

输出如下:

jQuery jQuery.fx.interval属性用法示例

木子山

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: