Popup Windows

Opening New/Popup Windows

Method 2 (Intermediate)

This method uses a javascript function to open a new, customizable window from a hyperlink (as opposed to the default behavior of having the new webpage open in the same window). The developer has control over the size and properties of the new window.

In this example, the resulting window will be 600 pixels wide and 400 pixels high, with many of the standard browser features disabled, other than the title bar and scrollbars. Additional pages can be 'pushed' to the same new window by putting a 'target' property in the anchor tag using the window name.

To implement, put this HTML code in your starting webpage:

<a href="javascript:popWinOpen('popup.asp',600,400);">Open window ("myWin")</a><br />
<a href="popup2.html" target="myWin">Push content to myWin</a><br />
<a href="javascript:pushURL('popup2.asp');">Push content to myWin (javascript)</a><br />
<a href="javascript:popWinClose();">Close myWin</a>

Try it out:

Open window ("myWin")
Push content to myWin
Push content to myWin (javascript)
Close myWin

You'll also need to include the following javascript functions:

var myWin;
myWin = "";
function popWinOpen(zURL,zWidth,zHeight) {
var popFeatures = "width=" + zWidth + ",height=" + zHeight + ",toolbar=0,location=0,directories=0,status=0,menuBar=0,scrollBars=1,resizable=1";
myWin = window.open(zURL,'myWin',popFeatures);
myWin.focus();
}
function popWinClose() {
// this will close the same 'myWin' popup that we opened
myWin = window.open('','myWin','');
myWin.close();
}
function pushURL(myURL) {
// this will load a new URL into the 'myWin' popup that we opened, or open a new 'myWin'
if ((!myWin.closed && myWin.location)) {
myWin.location = myURL;
} else {
var popFeatures = "width=600, height=400, toolbar=0, location=0, directories=0, status=0, menuBar=0, scrollBars=1, resizable=1";
myWin = window.open(myURL,'myWin',popFeatures);
}
myWin.focus();
}