JavaScript Window

## JS Basic

JS HOME JS Introduction JS How To JS Output JS Statements JS Comments JS Variables JS Data Types JS Objects JS Functions JS Operators JS Comparisons JS Conditions JS Switch JS Loop For JS Loop While JS Breaks JS Errors JS Validation

## JS Advanced

JS Object JS Number JS String JS Date JS Array JS Boolean JS Math JS RegExp

## JS HTML DOM

DOM Intro DOM Methods DOM Document DOM Elements DOM HTML DOM CSS DOM Events DOM Navigation DOM Nodes DOM Nodelist

## JS Browser BOM

JS Window JS Screen JS Location JS History JS Navigator JS PopupAlert JS Timing JS Cookies

## JS Libraries

JS Libraries JS jQuery JS Prototype

## JS Examples

JS Basic Examples JS Objects Examples JS DOM Examples JS HTML Examples JS Browser Examples JS Quiz JS Certificate JS Summary

## JS References

Javascript Objects HTML DOM Objects

# JavaScript Window - The Browser Object Model

« Previous
Next Chapter »

The Browser Object Model (BOM) allows JavaScript to "talk to" the browser.

## The Browser Object Model (BOM)

There are no official standards for the Browser Object Model (BOM).

Since modern browsers have implemented (almost) the same methods and properties for JavaScript interactivity, it is often referred to, as methods and properties of the BOM.

## The Window Object

The window object is supported by all browsers. It represent the browser's window.

All global JavaScript objects, functions, and variables automatically become members of the window object.

Global variables are properties of the window object.

Global functions are methods of the window object.

Even the document object (of the HTML DOM) is a property of the window object:

window.document.getElementById("header");

is the same as:

document.getElementById("header");

## Window Size

Three different properties can be used to determine the size of the browser window (the browser viewport, NOT including toolbars and scrollbars).

For Internet Explorer, Chrome, Firefox, Opera, and Safari:

- window.innerHeight - the inner height of the browser window
- window.innerWidth - the inner width of the browser window

For Internet Explorer 8, 7, 6, 5:

- document.documentElement.clientHeight
- document.documentElement.clientWidth
- or
- document.body.clientHeight
- document.body.clientWidth

A practical JavaScript solution (covering all browsers):

## Example

var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
Try it yourself »

The example displays the browser window's height and width: (NOT including toolbars/scrollbars)

## Other Window Methods

Some other methods:

- window.open() - open a new window
- window.close() - close the current window
- window.moveTo() -move the current window
- window.resizeTo() -resize the current window

« Previous
Next Chapter »

## Your suggestion:

Your E-mail (optional):

Page address:

Description:

Close [X]

## Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

## WEB HOSTING

Best Web Hosting UK Reseller Hosting Wow! $5 SSD Hosting

## WEB BUILDING

Download XML Editor
FREE Website BUILDER FREE Website Creator

## WEB RESOURCES

Web Statistics Web Validation

## SHARE THIS PAGE