Skip to content
Related Articles

Related Articles

jQuery | jQuery.fx.interval Property with example
  • Last Updated : 23 Oct, 2019
GeeksforGeeks - Summer Carnival Banner

The jQuery.fx.interval property in jQuery is used to modify the number of frames per second at which animations will run and to change the animation firing rate in milliseconds. Its default value is 13ms.

Syntax:

jQuery.fx.interval = milliseconds;

Parameters: This method accepts single parameter milliseconds which is mandatory. It is used to specify the animation firing rate in milliseconds. It default value is 13 milliseconds.

Example 1: This example uses jQuery.fx.interval property to change the animation firing rate.




<!DOCTYPE html>
<html>
  
<head
    <title>
        jQuery jQuery.fx.interval 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.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>  

Output

Example 2: This example uses jQuery.fx.interval property to change the animation firing rate.




<!DOCTYPE html>
<html>
  
<head
    <title>
        jQuery jQuery.fx.interval 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.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>  

Output:

Attention reader! Don’t stop learning now. Get hold of all the important DSA concepts with the DSA Self Paced Course at a student-friendly price and become industry ready.




My Personal Notes arrow_drop_up
Recommended Articles
Page :