Detecting the Browser Window Size With DHTML

Detecting the Browser Window Size With DHTML

Some users always maximize their browser window, while others like to keep it small. Not knowing the size of the client window can cause formatting problems for HTML pages; tables may contract, and text may wrap in strange ways. If your site visitor is using a version 4.0 or higher browser, it’s possible to detect the browser window’s height and width with JavaScript.

Microsoft Internet Explorer and Netscape Navigator do this slightly differently, so you’ll need to first detect the browser type and then set up the following variables:

For Internet Explorer:

 var BrowserHeight = document.body.clientHeight;var BrowserWidth =  document.body.clientWidth;

For Netscape Navigator:

 var BrowserHeight = window.innerHeight;var BrowserWidth = window.innerWidth;

With those variables in hand, you can lay out the page more effectively and reduce wasted space.


Share the Post: