Javascript – Jquery Change Height based on Browser Size/Resize

browserjavascriptjqueryscreen

I was wondering if there was a way to determine the height/width of a browser.
What i'm trying to do is set a height on a div to 500px when the browser size is 1024×768, and for anything lower i'd like to set it to 400px.

Thanks in advance

Best Solution

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.