Overview

In this chapter you will learn : Window object. Properties and methods of window object. Pop-up windows JavaScript Menu

JavaScript can be used to access a number of Document Object Model (DOM) objects. We have already discussed some of the objects from the Document Object Model ( DOM ). One of the important objects is Window Object.

Window Object

The Window object represents the browser window. It is a predefined object and thus does not require any declaration and it contains several other objects, such as document, history, location etc. Every window opened by the browser which supports JavaScript, defines a separate window object for the window. Whenever you use the statement

                                      document.write ( "JavaScript Statement " )
It is actually interpreted by the JavaScript interpreter as
                                      window.document.write("JavaScript Statement " )
The following tables describe all the properties and methods of window object :

Properties of Window Object

 

Property	Description
closed	It specifies a Boolean value to indicate whether a window has been closed or not. It returns Boolean 'true', if the window is closed.
defaultStatus	This property sets or returns the default string message, displayed in the status bar of the window. The message will be displayed when the page loads.
document	It refers to a document being displayed in a window. It also provides methods for displaying HTML output to the user.
frames	It refers to an array containing references to all the frames in the current window.
history	It contains the information regarding all the URL's, the user has visited, within a window.
innerHeight	This property determines the inner height (in pixels) of the window's display area.
innerWidth	This property determines the inner width (in pixels) of the window's display area.
length	It returns the total number of frames contained in a frameset or window.
location	It refers to the location object of the JavaScript, which contains the URL of a window.
locationbar	It represents the windows location bar which contains the details of the URL. The location bar property has its own property called visible, which has the default value true (visible) and it can be set to false (hidden).
menubar	It represents the windows menu bar which contains the various pull-down menus ( File, Edit, View etc.). This property also has its own property called visible, which is by default true and can be set as false(hidden).
name	It sets or returns the name of the window.
opener	It sets or returns a reference to a window object that causes a window to open.
parent	It refers to the window or frame whose frameset contains the current frame.
self	It refers to the current active window or frame.
status	It is a read-write property that allows you to refer to a temporary message appearing on the status bar.
top	It refers to a top-level window in a series of windows.
window	It refers to the current window or frame.

Methods of the Window Object

Method	Description
alert (text)	It displays an alert dialog box with the appropriate message and OK button
blur( )	This function will take the focus away from the window.
clearTimeout (timer)	It clears the predefined timeout.
close( )	This function will close the current or the specified window.
confirm (text)	It displays a confirm dialog box with the specified message and OK and Cancel buttons.
focus( )	It gives focus to a window and brings it to the front of the desktop.
open (url, name, [options])	It creates a window object and opens a new window.
prompt (text, defaultInput)	It displays a prompt dialog box with a message and an input field.
scroll (x, y)	It scrolls the window to the location specified by the X and Y values( in pixels).
setTimeout (expression, milliseconds)	This method executes an expression or calls a function once, after the interval of specified milliseconds has elapsed.
clearInterval (ID)	It clears a timeout that was set with the setInterval method.
moveBy(horz, vert)	This method moves the window by a specified amount in the horizontal and vertical direction ( in pixels ).
moveTo (width, height)	This method moves the window's left edge and top edge to the specified X an Y coordinates.
resizeBy (horz, vert)	It resizes the window by moving the bottom right corner.
resizeTo (width, height)	It adjusts the window by specified width and height dimensions.
scrollBy (horz, vert)	It scrolls the window by specified amount.
scrollTo (x, y)	It scrolls the window to a specific location.
setInterval (function, time, [args] )	It repeatedly invokes a function or evaluates an expression after a timeout, in milliseconds, expires.
stop( )	It stops the current window's downloading.

Pop-up Windows

A pop up window refers to a new browser window, usually smaller in size, that loads on top of the larger browser window , and contains a separate HTML documents inside it. A JavaScript pop up is opened either by the user clicking a button/ link or automatically.
        There are two methods used for opening and closing of the browser window, i.e., the open( ) and close( ) methods respectively. The open( ) method opens a new browser window at a specified URL and with a given set of options. The open( ) method invokes a newly created object in return. This object is usually assigned to a variable that is used to keep track of the window. The syntax of the open( ) method is
        variable = open ( url, name, [options] )
Here, variable is the name of the variable assigned to the window object. url is the URL of the document that is to be opened in particular window, name is the name that is assigned to the window and options is used to define different features of the window. The name can also be supplied in the target attribute of a <form> or <a> tag.

JavaScript Menu

JavaScript Menu is a powerful JavaScript producing design tool for creating menu on web pages. It is very easy to create professional-looking JavaScript menu with the help of tools already provided within this tutorial. You can create Slide shows and scrolling text through JavaScript menu.

Slide Shows

Slide show displays an array of images in an automated slide show, a pull down menu, or the various slide show controls which can be included, such as, previous, next or play again. To create a slide show, import the images you want to include in the slide show. Preload the images using JavaScript. Preload, in JavaScript, refers to the loading of images into cache prior to displaying them. Preloading images is "necessary" in a slide show, since the switching between images have to be instantaneous, without any delay.

Scrolling Text

Scrolling text is a JavaScript menu design tool for creating script which scrolls text vertically on web pages. A select menu scrolls and rotates the items to give the appearance that they are scrolling. Scrolling text can also act as a JavaScript news flash. These scripts scroll some information on the screen or the information can be scrolled on the status bar or in a text box.