Jquery Change Height based on Browser Size/Resize
Solution 1:
If you are using jQuery 1.2 or newer, you can simply use these:
$(window).width();
$(document).width();
$(window).height();
$(document).height();
From there it is a simple matter to decide the height of your element.
Solution 2:
$(function(){
$(window).resize(function(){
var h = $(window).height();
var w = $(window).width();
$("#elementToResize").css('height',(h < 768 || w < 1024) ? 500 : 400);
});
});
Scrollbars etc have an effect on the window size so you may want to tweak to desired size.