Question

I’ve seen another reference to this but I can’t understand the response.
I am trying to change the height of a page element (#maincontent) dynamically as the window is re-sized.

This is my code:

$(function() {
   if($(window).resize()){
      var h1 = $(window).height();
      var h2 = $('#maincontent').height();
      if (h2<h1){
          $('#maincontent').css('height',h1);
      }
   }
});

It doesn’t work without a page refresh and I can’t understand why not. Where have I gone wrong?

Answer 1

Your not capturing the window resize event properly:

   $(window).resize(function () {

      var h1 = $(window).height();
      var h2 = $('#maincontent').height();
      if (h2<h1){
          $('#maincontent').css('height',h1);
      }

   });