There are certain times, while your site visitors cruise around your Web page, that it would be nice to pop open a little window to show certain pages or images, without going to a whole new Webpage. Little popup windows are extremely handy for presenting information while keeping the visitor on the same page. Let's look at some of the neat things we can do with popup windows.

To begin with, we're going to use a Javascript href to do what we want. Associated with the "Open" action are three sections or parameters. In the code below, you see the following:'','miniwin','toolbar=1,location=0,width=300,height=300')

The first part is the webpage URL. The next is the "name" of the window (can be used for targeting). And the last section is any features for the window that will be popped open. This is explained further below.

Opening a basic 300x300 window

» Open the Window
<a href="javascript:void(0)" onClick="'','miniwin','toolbar=1,location=1,directories=1,status=1,menubar=1,scrollbars=1,resizable=1,width=300,height=300')">Open a Window </a>

Opening the window with all features turned off

» Open the Window
<a href="javascript:void(0)" onClick="'','miniwin','toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,width=300,height=300')">Open A Window </a>

A List of Window Features ( 0=off  ,  1=on )

» TEST     all values set to 1 (on)
» TEST     toolbar=0    (back, reload, home, etc.)
» TEST     location=0    (url input field)
» TEST     directories=0    (favorites)
» TEST     status=0    (at bottom of page)
» TEST     menubar=0    (file, edit, view, etc.)
» TEST     scrollbars=0    (can the person scroll?)
» TEST     resizable=0    (can the window be stretched)
» TEST     width=600    (width of window in pixels)
» TEST     height=400    (height of window in pixels)
» TEST     all values set to 0 (off)

<script for="window" event="onload()">"", "underconstruction", "scrollbars=no,resizable=no,height=62,width=93")

Adding a "close window button"

The close window button is nice to offer the reader. It can be in the form of a button, image, or a text link.

» Try The Close Me Window
Button link: <form><input type="button" value="Close Window" onClick="window.close()"></form>
Text link: <a href="javascript:window.close()">CLOSE WINDOW</a>
Image link: <a href="javascript:window.close()"><img src="closeme.gif" border="0" alt="[CLOSE ME"></a>

Let the window close on its own.

You also have a choice to have the window "auto-close" after a specified amount of time. Add a small piece of code in the body tag and you're set.

» Try the `Auto-Close` Window

Have the window open when the page loads.

Maybe you want to have a popup window open when the main page initially loads...

» Try the `Pop-up when Arriving` Window

Have the window open when you leave the page.

Maybe you want to have a popup window open when the visitor leaves the page...

» Try the `Pop-up when Leaving` Window

More great Javascripts at
The JavaFile.

[JavaFILE...FREE Java and Javascripts!