Creating and Controlling Windows with Javascript

Using Javascript, you can create links that open in browser windows that have specific sizes and appearances. You can also use Javascript to create a function that will send your windows to the front of the desktop, even if they are minimized or hidden behind other windows before the link is activated.

I use the following script, which I adapted from the surfto script described in the coding primer, Creating a Forms-Based Navigation Menu, to open new windows or to send already open windows to the front of the desktop:

<HTML>
<HEAD>
   <TITLE>Open and Send Window to Front Example</TITLE>
   <script language="JavaScript">
   <!-- Hide the script from old browsers --
	function OpenPage(page) {
		var NewWindow=open('','popup','menubar=1,toolbar=1,location=1,directories=1,scrollbars=1,resizable=1,status=1,width=640,height=480');
	NewWindow.focus();
	    window.open(page,target="popup");
  }
  // -->
</SCRIPT>
</HEAD>

To use this function, you need to modify your links so that they appear as follows:

Click the <A HREF="javascript:OpenPage('warning.cfm')">warning to see how the OpenPage function works.

Try it Out: Click the warning to see how the OpenPage function works.

This script, when activated by the link, opens the warning.cfm file in a window named "popup". If the window has already been opened, it will bring it to the front of the desktop (in front of every other window on your computer's desktop) regardless of whether it has been minimized or just hidden behind other windows. If this script is used on a framed page that has a frame named popup, it will open the file in the popup frame and ignore the parts of the script that specify the size and appearance of the window (see below).

To control the size and appearance of the window, you can set the following values in the script:

Attribute	Definition and Values
menubar	Determines whether the menubar is displayed in the browser window. 1 = yes; 0 = no.
toolbar	Determines whether the toolbar is displayed in the browser window. 1 = yes; 0 = no.
location	Determines whether the location bar is displayed in the browser window. 1 = yes; 0 = no.
directories	Determines whether the directories toolbar is displayed in the browser window. 1 = yes; 0 = no.
scrollbars	Determines whether scrollbars are displayed in the browser window. 1 = yes; 0 = no
resizable	Determines whether the window can be resized. 1 = yes; 0 = no.
status	Determines whether the status bar is displayed in the browser window. 1 = yes; 0 = no.
width	Specifies the width of the browser window, in pixels.
height	Specifies the height of the browser window, in pixels.
Window Name	In this script, the window or frame name (which determines how it is targeted in a link, see the discussion of Frames) is specified immediately before menubar. In this script, the link opens a new window called "popup".

Links Page: Learn more about Javascript on the Javascript links page.

Coding Primer: View Using Javascript to learn about other useful javascripts.

Writing Guides

Writing for the Web

Creating and Controlling Windows with Javascript