Javascript – How to wait for the ‘end’ of ‘resize’ event and only then perform an action

htmljavascriptjqueryjquery-eventsresize

So I currently use something like:

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

But this gets called many times while resizing process goes on. Is it possible to catch an event when it ends?

Best Answer

You can use setTimeout() and clearTimeout()

function resizedw(){
    // Haven't resized in 100ms!
}

var doit;
window.onresize = function(){
  clearTimeout(doit);
  doit = setTimeout(resizedw, 100);
};

Code example on jsfiddle.