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.

See also  Is Machine Learning Automating Creativity in Graphic Design?

About Our Editorial Process

At DevX, we’re dedicated to tech entrepreneurship. Our team closely follows industry shifts, new products, AI breakthroughs, technology trends, and funding announcements. Articles undergo thorough editing to ensure accuracy and clarity, reflecting DevX’s style and supporting entrepreneurs in the tech sphere.

See our full editorial policy.

About Our Journalist