How to call a function with window.resize()

Question

I have the following code, which sets the height of a div when the window loads:

$(window).bind("load", function() { 

          var 
           windowHeight = $(window).height(),
           callerPrimaryHeight = $('.caller-primary-nav').outerHeight(),
           callerSecondaryHeight =  $('.caller-secondary-nav').outerHeight(),
           callerFooterHeight = $('.caller-footer').outerHeight(),
           callerHeight = windowHeight - callerPrimaryHeight - callerSecondaryHeight - callerFooterHeight;

           positionCallers();

          function positionCallers() {  
           $('.caller-block').outerHeight(callerHeight);
         }

});

How can I call this function when the window resizes? I know the function is $('window').resize(); but how can I can the positionCallers() function outside of the window load?

Declare `positionCallers` in global scope. Add pass a parameter to set outer height — Satpal, Dec 28 '13 at 14:02
http://stackoverflow.com/questions/10312696/how-to-call-a-function-in-jquery-on-window-resize — Vikas Arora, Dec 28 '13 at 14:03

score 0 · Accepted Answer · answered Dec 28 '13 at 14:10

you can bind multiple events like this:

$(window).bind("load resize", function() {
    //..........all your code here......
}).resize();

but also you need a doc ready handler, put it when dom is ready for your code:

$(function(){
   $(window).bind("load resize", function() {
       //..........all your code here......
   }).resize();
});

How to call a function with window.resize()

1 Answers1