throttledresize event

The jQuery Mobile throttledresize event is a special event that prevents browsers from running continuous callbacks on resize. throttledresize is used internally for orientationchange in browsers like Internet Explorer. throttledresize ensures that a held event will execute after the timeout so logic that depends on the final conditions after a resize is complete will still execute properly.

The throttledresize event is triggered if orientationchange is not natively supported.

This event triggers when the browser window resizes from:

1. an orientation change (orientation-enabled device);
2. changes in dimension ratio that replicates a landspace/portrait change (resizing a desktop browser).

This plugin extends jQuery's built-in method. If jQuery Mobile is not loaded, calling the .throttledresize() method may not fail directly, as the method still exists. However, the expected behavior will not occur.

var count = 0;
$(function() {
  // Bind an event handler to window throttledresize event that, when triggered,
  // passes a reference of itself that is accessible by the callback function.
  $( window ).on( "throttledresize", throttledresizeHandler );
 
  function throttledresizeHandler( event ) {
    $( "#output-text" ).html( "Event Count: " + ++count );
  }
 
  // You can also manually force this event to fire.
  $( window ).trigger( "throttledresize" );
});

Visit this from your orientation-enabled device to see it in action!