Popup Window Demo

Click here to see a popup window.
The following HTML code will create the above portion of this page. In the HTML code, a Javascript file called popup.js is used. Two functions closeDep() and popup() are defined in the Javascript file.  

<HTML><HEAD><TITLE>Popup Window Demo</TITLE>
<SCRIPT LANGUAGE="JavaScript1.2" src="popup.js">
</SCRIPT>
</HEAD>
<BODY onUnload="closeDep()">
<H3>Popup Window Demo</H3>
<center>Click <a href="javascript:popup(demo)">here</a> to see a popup window. </center>
</BODY>
</HTML>

Here is the Javascript code for popup.js that should be in the same directory of the above HTML file. 
/*******Popup Window Definition*********************/

var htmlOpener = "<html><head><title>Popup Window Demo</title>"+
			"</head><body bgcolor='navyblue'><p>"
var htmlCloser = "</body></html>"

 demo = "<center><b>Popup Window</b></center><p>Here you can put any legal"+
        " html string. For example, you can put a graph here. <center>"+
        " <p><img src="corr.gif"></center>"

/****END OF STRING DEFINITION*****/


 var popupWin
 var wholeWin
  function popup(term)  // write corresponding content to the popup window
  {
   popupWin = window.open("", "puWin",  "width=480,height=200,scrollbars,dependent,resizable");
   popupWin.document.open("text/html", "replace"); 
   popupWin.document.write(htmlOpener);
   popupWin.document.write(term);
   popupWin.document.write(htmlCloser);
   popupWin.document.close();  // close layout stream
   popupWin.focus();  // bring the popup window to the front
  }
 
  function closeDep() {
  if (popupWin && popupWin.open && !popupWin.closed) popupWin.close();
  if (wholeWin && wholeWin.open && !wholeWin.closed) wholeWin.close();

  }
Comments.

Copy the html code to a html file and copy the Javascript code to a file called popup.js and save them in a directory, off you have a popup window webpage! You can now modify the code to have your own popup windows.

  1. Function closeDep() is to close popup window when the main window is closed.
  2. Function popup is called when the link is clicked. It takes a string as an argument. The name of the string can be quite arbitrary, except any JavaScript keywords. The name of our only popup window on this page, is called demo and is defined in the JavaScript file as shown above.