5360 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

If you’ve ever used this:


... you probably know about spastic resizing.

And for spastic browsers (Mac) this is great, but for browsers that aren’t spastic (Windows) it just isn’t needed. So tonight I figured out a way that satisfies both. Hope someone finds it useful.

$(document).ready(function() {

    var timer, prevW, prevH, fired, win = $(window);

    win.on("resize", resizer);

    // this function is called every time the browser resizes
    function resizer() {

        // catch the event for the first time, call the resize function
        if(!fired) sizeIt("cj");

        // use the "debounced" method for spastic resizing
        timer = setTimeout(sizeIt, 100);


    // the actual resizing happens here
    function sizeIt(st) {

        var winWidth = win.width(),
        winHeight = win.height();

        // at the end of the function we store the windows width and height,
        // if we get the same exact values twice in a row, there's no need to continue
        // on a non-spastic browser, this will ensure that the actual resizing only happens once
        if(prevW === winWidth && prevH === winHeight) return;


        // DO RESIZE STUFF HERE        


        prevW = winWidth;
        prevH = winHeight;
        fired = st === "cj";



The Benefit: Never a delay for resizing on a non-spastic browser, and resizing only happens once.
The Sacrifice: Content resizing will always happen twice (but only twice) on a spastic browser.

196 posts
  • Member of the Envato Team
  • Had an item featured on Envato Market
  • Contributed a free file of the month
  • Has been a beta tester for an Envato feature
+12 more
Crusader12 Envato team says

Thanks for posting this, can’t wait to test it out :)