Create A Simple JavaScript window.open Popup

JavaScript centered Popup to a URL
Date: 
Tue, 20/12/2011

Do you need to create a simple pop up window that is centred for your site? Here is some simple JavaScript that you can in bed in your site that uses function popUp(URL) and window.open.

  • Change the comma-separated list of values (See below)
  • Add the URL for the popup
  • Change the Image size and location.


Put the script in your head section of your site and image location in your body area.

 

<script language="JavaScript">
<!-- Begin
function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=600,height=500,left = 327.5,top = 234.5');");
}
// End -->
</script>

<a href="javascript:popUp('http://www.YOUR_URL.com')"><img src="/YOUR_IMAGE_URL.png" style="width: 200px; height: 400px;"></a>

 

The values on the pop up can change to suit your needs, I have turned them off for purposes of this tutorial but if you want to change them just set the =0 to =1.

  • Channelmode = 1 | 0  Whether or not to display the window in theater mode. Default is no. IE only
  • Directories = 1 | 0  Whether or not to add directory buttons. Default is yes. IE only
  •  Fullscreen = 1 | 0  Whether or not to display the browser in full-screen mode. Default is no. A window in full-screen mode must also be in theater mode. IE only
  • Height = pixels  The height of the window. Min. value is 100
  • Left = pixels  The left position of the window
  • location = 1 | 0  Whether or not to display the address field. Default is yes
  • Menubar = 1 | 0  Whether or not to display the menu bar. Default is yes
  • Resizable = 1 | 0  Whether or not the window is resizable. Default is yes
  • Scrollbars = 1 | 0  Whether or not to display scroll bars. Default is yes
  • Status = 1 | 0  Whether or not to add a status bar. Default is yes
  • Titlebar = 1 | 0  Whether or not to display the title bar. Ignored unless the calling application is an HTML Application or a trusted dialog box. Default is yes
  • Toolbar = 1 | 0  Whether or not to display the browser toolbar. Default is yes
  • Top = pixels  The top position of the window. IE only
  • Width = pixels  The width of the window. Min. value is 100

To see more information on values and about popup, check the WC3 site.

 

Your rating: None Average: 4 (1 vote)

Ed Walsh

Recent Comments