title: JQuery: how to update variable as browser resizes?
body: <pre><code>&lt;script&gt;
      $(document).ready ( function () {
          var footerheight = $('#footer').height();
          $('#footer').css('height', footerheight);
          $('#footer').css('marginTop', - footerheight);
          $('#nonfooterinner').css('paddingBottom', footerheight);
      });
      $(window).bind("resize", function () {
          var footerheight = $('#footer').height();
          $('#footer').css('height', footerheight);
          $('#footer').css('marginTop', - footerheight);
          $('#nonfooterinner').css('paddingBottom', footerheight);
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Is this the proper/preferred way to set the variable "footerheight" to update as the browser resizes? The top half of the script obviously determines the variable when the document loads but I'm not sure if the bottom half is scripted properly to update that variable as the window expands/contracts.</p>