jQuery resize() using browser maximise button

Question

This is my code that fires whenever the window is resized:

$(window).resize(function()
{   
    setDisplayBoardSize();
});

Fires fine when I re

Answer 1

I was having a similar issue on a responsive site where every asset would resize and shift appropriately except for the image slideshow. This only happened in IE, and it only happened when you would start at the tablet breakpoint, then hit the maximize button and enter the desktop breakpoint.

What ended up fixing the problem was throttling the resize trigger using this handy code from Paul Irish:

(function($,sr){

  // debouncing function from John Hann
  // http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
  var debounce = function (func, threshold, execAsap) {
      var timeout;

      return function debounced () {
          var obj = this, args = arguments;
          function delayed () {
              if (!execAsap)
                  func.apply(obj, args);
              timeout = null;
          };

          if (timeout)
              clearTimeout(timeout);
          else if (execAsap)
              func.apply(obj, args);

          timeout = setTimeout(delayed, threshold || 100);
      };
  }
  // smartresize 
  jQuery.fn[sr] = function(fn){  return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr); };

})(jQuery,'smartresize');


// usage:
$(window).smartresize(function(){
  // code that takes it easy...
});

You can see his full post about it (from 2009) here: http://www.paulirish.com/2009/throttled-smartresize-jquery-event-handler/

Hope that helps somebody out there.