Jim Hanson's

New Browser Windows

This script is an example of creating a new browser window that should be smaller than the window that is creating it (the new window will be 500 by 400 pixels while the current window will probably be greater than that). The viewer will be able to resize the window if desired.

The HTML used here to open a new browser window is:

<A HREF="javascript:newPopwin('js_new.htm')"> JS Window Example </A>

This will bring up a page called js_new.htm into its own smaller window. As can be seen below, this window will have a toolbar and status line as well as scroll bars (if needed) and be resizable. (Below you can see a minimal pop-up window with nothing other than the HTML page displayed.) Try this to get a new browser window:

JS Window Example

Here is the JavaScript for this function. Remember that this function should be placed in the HEAD section of the page.

<SCRIPT LANGUAGE="JavaScript"> // note NO spaces in the window specs
function newPopwin(page){
    Popwin = window.open(page,'',
        'width=500,height=400,scrollbars=1,'+
        'resizable=1,status=1,menubar=1,toolbar=0,'+
        'location=0,directories=0,copyhistory=0');
}
</script>

The parameters in the window.open method include:
page
A parameter that is the URL of the page to be loaded into the new browser window
name
This name is the window name to use in the TARGET attribute of an <A> and <FORM> tag - it is not commonly used (it is null in the above example - e.g. '')
width
The width of the new window, in pixels
height
The height of the new window, in pixels
scrollbars
0=no scroll bars, 1=scroll bars, if needed
resizable
0=no resizing allowed, 1=user can resize window
status
0=no status bar at bottom, 1=status bar is displayed
menubar
0=no menu bar displayed, 1=menu bar is displayed
toolbar
0=no tool bar displayed, 1=tool bar is displayed
location
0=no menu bar displayed, 1=menubar is displayed
directories
0=no directory buttons displayed, 1=directory buttons displayed
copyhistory
0=don't copy history list, 1=copy history list from prior window

Note: If the menubar value is 1 (ON), then under OPTIONS the viewer can turn ON or OFF the toolbar, location, and directory options. With the menubar = 0, the viewer can't do anything except close the window.

Instruction Pop-ups

Another use for a new browser window is for a pop-up displaying instructions. You can create a pop-up with no options for the user to change the size or select browser menu items or the like. They just see the information you want to display.

You can include a FORM with an action button to close the window with onClick=closeWindow() specified. See THESE INSTRUCTIONS for an example.

NOTE: This window is specified with no scrolling (default), no resizing, and no menu. This means that if the HTML is too big for the window, the viewer will miss some of the page. If this may be a problem, specify scrollbars=1 in the open statement.

The JavaScript function (located in the HEAD of this page) to open this window is:

<SCRIPT LANGUAGE="JavaScript">
<!--
function instruct() {
   mwin = window.open("js_instruct.htm","",
    "status=no,toolbar=no,location=no,menu=no,width=400,height=300");
}
//-->
</SCRIPT>

The statement used in the body here to call this function was:

<A NAME="here""></A>

<A HREF="#here" onClick="instruct();">THESE INSTRUCTIONS</A>

There are two additional parameters you can use to cause the new window to show up wherever you want it on the screen. They are screenX and screenY. Adding these to the window.open parameter list positions the pop-up in a predictable location. In the example above, I added the following to place the THESE INSTRUCTIONS pop-up in the upper left corner of the screen:

screenX=0,screenY=0
Note that when you exit this page, the pop-up will be deleted at the same time. Unfortunately, this feature doesn't work for some versions of Internet Explorer (close isn't recognized method for their JavaScript).

NOTE: A new browser window was opened for viewing these pages. To return, you can just select another browser (from the task bar in Windows 95 or click your mouse somewhere on another window). You can also close (or File, Exit) from this window when done, leaving only the calling window.

Copyright © 1998 Jim Hanson Last update: May 27, 1998
Internet Link Exchange
Member of the Internet Link Exchange Free Home Pages at GeoCities

This page hosted by GEOCITIES Get your own Free Home