Get the browser viewport dimensions with Javascript

Question

I want to provide my visitors the ability to see images in high quality, is there any way I can detect the window size (or better yet, the viewport size - see green area) of the browser with Javascript?

Answer 1

jquery ? $(window).width() and $(window).height()

Answer 2

If you aren't using jQuery, it gets ugly. Here's a snippet that should work on all new browsers. The behavior is different in Quirks mode and standards mode in IE. This takes care of it.

var elem = (document.compatMode === "CSS1Compat") ? 
    document.documentElement :
    document.body;

var height = elem.clientHeight;
var width = elem.clientWidth;