Search within TutorialsPark

Javascript BOM : Window Object

The properties and methods of Javascript Window Objects.

Javascript Browser Object Model : Working with window Object

The window object represents the browser's frame or window, in which the webpage is contained.

The window object can be used to find out what the browser is running, the pages visited, size of browser window or user screen, alter text in browser status bars, open new windows , change the page that is loaded.

The window object is a Global Object, hence its name need not be used to access its properties and methods. In fact, Global functions and variables are all created as properties of the local object.

Eg: The method alert() will produce same result as window.alert(), since window object is global object.

Javascript Window Object: Global Scope

The window object is a global object, all variables and functions declared globally become properties an methods of window object.

In the below example, variable OS and function sayName() are defined in the global scope, which automatically places them on the window object.

Hence, the variable OS is accessible as window.OS and function sayName() is also accessible via window.sayName() .

Example: Javascript Window Object Global Scope

Give it a TRY! » Note: Since sayName() exists in global scope, this.OS maps to window.OS, hence the correct result is displayed.

Javascript Window Object: Opening and closing windows

A new window can be opened by pressing the new Window button from the file menu or by using a Javascript program with the window method open .

This windows are also called as popups.Viewers might not even see these windows as most browsers offer popup advertising filters

Syntax: Javascript Window Object Opening windows

Example: Javascript Window Object Opening windows

Give it a TRY! » Note: The open method is called and returns a window object that is assigned to the variable newWindow

Javascript Window Object : Open and Close Windows

The window object's open() method is used to open windows and close using close() method. .

Example : Javascript Objects Accessor Properties

Give it a TRY! » Note: Here, the closeWindow() is an user-defined function.

Javascript Window Object : Moving and Resizing a Window

Javascript has several methods by which you can move or resize windows, it can moved or resizes absolutely or relative to its current position or size.

Table : Move and Resize Methods

Method Example Description
moveBy() moveBy(30,30) To move the window relatively by 30 pixels along both the axes
moveTo() moveTo(0,0) Moves to top left corner of the screen.
resizeBy() moveBy(50,50) Resizes the window relatively by 50* 50 pixels.
resizeTo() resizeTo(500,500) Incase the value specified by digits is too small or too large. Value in between 1 to 21 digits won't cause Range errors.

Example: Javascript Window Object Moving and Resizing Windows

Give it a TRY! » Note:The resizeable option is turned off, hence the user cannot minimize or maximize the window.

Javascript Window Object: Getting Information About the window

The basic function of the window object is to get information about the Browser window.

Example: Javascript Window Object Getting Information About the Window

Give it a TRY! » Note: See Window Object Reference to see all the properties in great detail.

Javascript Window Object: Interaction with the Window

The Window object provides a set of method through which you can interact with the window that contains your document.

These methods should be used with caution because they take control of the browser window away from the user.

Table : Interaction with the Window

Name Description Returns
blur() To Unfocuses the Window void
close() To Close the window void
focus() To focus on the Window void
print() Prompts the user to print the page void
scrollBy(x, y) To Scroll the document relative to its current position void
scrollTo(x, y) To Scroll to the specifies position void
stop() To stop the document from loading void

Example: Javascript Window Object Interactive Features

Give it a TRY! » Note: If you are using these methods, do provide a notification to the user.

Javascript Window Object: PopUp Blocker

In order to block unexpected popups, most browsers have a built in popup blocker. When a popup is blocked, two things can have happen:

1. Either will most likely return null. This can be confirmed by checking the return value.

2. Or will return an error. This can be confirmed by checking the return value and wrap the call to in a try-catch block.

Example: Javascript Window Object Pop Up Blocker

Give it a TRY! » Note: If you are using these methods, do provide a notification to the user.