Search code examples
javascriptjqueryhtmlresizejquery-events

How to wait for the 'end' of 'resize' event and only then perform an action?


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?


Solution

  • I had luck with the following recommendation: http://forum.jquery.com/topic/the-resizeend-event

    Here's the code so you don't have to dig through his post's link & source:

    var rtime;
    var timeout = false;
    var delta = 200;
    $(window).resize(function() {
        rtime = new Date();
        if (timeout === false) {
            timeout = true;
            setTimeout(resizeend, delta);
        }
    });
    
    function resizeend() {
        if (new Date() - rtime < delta) {
            setTimeout(resizeend, delta);
        } else {
            timeout = false;
            alert('Done resizing');
        }               
    }
    

    Thanks sime.vidas for the code!