refresh or trigger javascript on window resize

Question

I am using this javascript to make two child div's the same height in their parent div:

$(function(){
var leftHeight = $('.leftblock').height();
var rightHeight = $('.rightblock').height();
if (leftHeight > rightHeight){ $('.rightblock').css('height', leftHeight); }
else{ $('.leftblock').css('height', rightHeight); }
});

When I resize the window one of the divs is getting a lot longer again but now the javascript doesn't work anymore. I placed the exact same script again in the window resize function and that solves the problem!

$(window).resize(function(){ // same script as above again });

My question; is there a cleaner way so I can just use the script once but refresh or trigger the script again on window resize?

Sacho · Accepted Answer · 2014-11-19 11:11:11Z

2

Sure, declare a function and use it in both handlers:

function resizeDivs() {
    var leftHeight = $('.leftblock').height();
    var rightHeight = $('.rightblock').height();
    if (leftHeight > rightHeight){ $('.rightblock').css('height', leftHeight); }
    else{ $('.leftblock').css('height', rightHeight); }
}
$(resizeDivs);
$(window).resize(resizeDivs);

answered Nov 19, 2014 at 11:11

Sacho

2,1891 gold badge14 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

StudioTime · Accepted Answer · 2018-08-14 07:59:26Z

1

You can declare function and call it whenever you want.

Try using function :

function check(){
    var leftHeight = $('.leftblock').height();
    var rightHeight = $('.rightblock').height();
    if (leftHeight > rightHeight){ 
        $('.rightblock').css('height', leftHeight); 
    } else {
        $('.leftblock').css('height', rightHeight); 
    }
}

$(function(){
    check();//calling function on window load
    $(window).resize(function(){
        check();//calling function on window resize
    });
});

edited Aug 14, 2018 at 7:59

StudioTime

24.4k40 gold badges129 silver badges217 bronze badges

answered Nov 19, 2014 at 11:12

Manwal

23.9k15 gold badges65 silver badges95 bronze badges

1 Comment

Erwin van Ekeren Over a year ago

I already implemented the answer of Sacho but your answer works as well! thank you

Collectives™ on Stack Overflow

refresh or trigger javascript on window resize

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related