How to Make a Window Pop Up with JavaScript


The following code defines the properties of a new window to pop up on the screen:

function popup() {
var newWin = window.open("method.html", "method_desc", "status=no,width=300,height=200")
}

There is a lot going on here.

function popup() {

This gives the function a name.

var newWin =

This declares the new window as a variable. What this does is to provide a way to bring it back later by the variable name. This is not required for the function to work.

window.open(

'window' is the object and 'open' is the method of that object. This is the JavaScript code to make a new window appear on the screen.

"method.html"

This tells what html file you want to appear in the window that pops up. It could be an image instead if you wanted.

, "method_desc"

Here, once again, I am simply naming the window. I can now use links to target this new window by name from other pages.

, "status=no, "

There are many features available for a new window. If no features are specified, they will all default to '=yes'. The group of specicfied feature options must be enclosed in quotation marks. Specifically this code tells the window not to include a status bar. But, it does a lot more than is apparent. Once any single feature is set to '=no' all features default to '=no' unless then set to '=yes'.

width=300,height=200

The size of the window is a feature that can be set, as is done here.

Now that we've defined what we want to pop up, one of several methods must be utilized to cause the window to pop up. These can either be automatic or based on user action.

One automatic way to get the window to pop up is to cause it to do so whenever a page loads. The code for this is:

<BODY onLoad="popup()">

A user action of clicking can be invoked with the onClick method:

<A HREF="#" "onClick=popup()"> Pop Up Window </A>