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:OpenPageBlank('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".
See Also
Links Page: Learn more about Javascript on the Javascript links page.

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

See Also