Creating a Pop-up Window

Creating a 'Pop-up' Window

A "Pop up" window (also called a "Sub Window") is a new window within the existing window.

HTML/JavaScript Code

Result

<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function subwindow() {
NewWindow = window.open("subwindow.htm", "NewWindow",
"status = no, toolbar = no, location = no, left = 200,
top = 200, width = 400, height = 100");
}
// The statement starting with "NewWindow" must be on ONE line.
</SCRIPT>
</HEAD>

<BODY>
<A HREF="#" onClick="subwindow();"> Click here to open a Sub Window...</A>
</BODY>

Click here to open a Sub Window...

(See below for a listing of the code for the Sub Window.)

The Sub-Window code is:

<BODY>
This is the Pop-up Window
<BR>
<FORM NAME="test">
<input TYPE="button" VALUE="Click here to close the Sub Window"
onClick="window.close();">
</FORM>
</BODY>

NOTE1: When the user clicks on the link the file "subwindow.htm" is loaded and displayed as a "Sub Window". The Sub Window you create is a standard Web document. It can be as complex as you wish. In the example above the size of the Sub Window was restricted to make it fit easily on the page.

NOTE2:
status = no means do not display the Status Line at the bottom of the window.
toolbar = no means do not show the Toolbar on the Sub Window.
location = no means do not display the Location at the top of the Sub Window.
left = 200 means the top/left corner of the Sub Window is 200 pixels in from the left.
top = 200 means the top/left corner of the Sub Window is 200 pixels down from the top.
width = 400 means the Sub Window is 400 pixels wide.
height = 100 means the Sub Window is 100 pixels high.

These parameters can be left out and the 'default' values will apply.

<- Back - Menu - Next ->