jQuery.fx.intervalS2C Home « Effects « jQuery.fx.interval

Animation rate property.

Description

The jQuery.fx.interval property holds the animation firing rate in milliseconds.

  • The default value of jQuery.fx.interval is 13 milliseconds, but the property can be modified to adjust the number of frames per second at which animations will run.
  • Lowering the firing rate can make animations run smoother but may effect performance.
  • As jQuery uses one global interval, for any changes to the jQuery.fx.interval property to take effect, no animation should be running or all animations should be stopped first.
  • The jQuery.fx.interval property currently has no effect in browsers that support the requestAnimationFrame property.

Shorthand version $.fx.interval

Syntax


Signature Description
jQuery.fx.interval = 50;Modify the animation firing rate.

Parameters

None.

Return

A JavaScript Number object.

jQuery.fx.interval Examplesgo to top of page Top

Modify the animation firing rate in milliseconds.

In the example below when the left button is pressed we toggle the image below of thai green curry and the animation runs pretty smoothly at 1300 milliseconds.

Each time the right button is pressed we add 100 milliseconds to the jQuery.fx.interval property. Notice how the animation becomes choppier the more milliseconds we add to the jQuery.fx.interval property.

a picture of curry a picture of curry



$(function(){
  $('#btn1').on('click', function() {
    $('#curry1').toggle(2000);
  });
  $('#btn2').on('click', function() {
    jQuery.fx.interval += 100;
  });
});

Press the buttons below to action the above code:

     


go to home page Homepage go to top of page Top