I’m inclined to say “…for those of you that are not familiar with Pop-Up windows…” and then explain what they are. If you don’t already know what a Pop-Up window is, then this newsletter is probably your first experience with the Internet. Pop-Up Windows are everywhere and are more often than not, a major announce akin to Spam. There are however, many legitimate uses for Pop-Up windows. For instance, when you wish to display additional or ancillary information to the current topic.
I have posted an example at is46fig1.htm . When you click on “Show me the Script”, a window will popup with the JavaScript code that is used to create the Pop-Up window. The script itself is pretty simple:
<SCRIPT language=”JavaScript” type=”text/javascript”>
function pop_window(page) {popup = window.open (page,”title”,
“screenX=80, screenY=180, width=300, height=250, innerWidth=280,
innerHeight=230, resizable=1, alwaysLowered =0, alwaysRaised=1,
z-lock=1, dependent=1, directories=0, hotkeys=1, location=0,
menubar=0, scrollbars=1, titlebar=1, toolbar=0, status=0,”);}
</script>
<a href=”http://www.IMSWebTips.com/is46fig1.htm”>is46fig1</a>
In the above example, the window.open call contains 3 sets of parameters.
page: is the URL of the page to be opened. If it is left blank, an empty page will be opened.
title: is a title to be given to the window. It can be used to reference the new window from the current window.
The third parameter is a list of options. Most of them will default to “disabled” if not included in the list. To enable them simply include them in the list or assign them a value of 1. A value of 0 will disable them. Some options require a value.
left Specifies the left location of the window in pixels. top Specifies the top location of the window in pixels. width Sets the width in pixels. height Sets the height of the window in pixels. innerHeight Sets the inner height of the window in pixels. innerWidth Sets the inner width of the window in pixels. outerHeight Sets the outer height in pixels. outerWidth Sets the outer width in pixels. resizable Will create a resizable window. alwaysLowered The window will float below other windows. alwaysRaised The window will float above other windows. z-lock Prevents the window from being hidden. dependent Will close the window when the parent closes. directories Will display the standard directory buttons. hotkeys Will disable or enable the use of hot keys. location Sets the Location entry field. menubar Will enable the menu bar scrollbars Will enable scrollbars titlebar Will enable the Title bar. toolbar Will enable the toolbar. status Will enable the status bar.
When the window.open function executes successfully, it will return the link to the window so that it can be accessed from the parent window. If for example, you open a popup window without a URL, you can write to it directly.
<SCRIPT language=”JavaScript” type=”text/javascript”>
function empty_window () {
popup = window.open (“”, “title”, “width=200,height=150”);
popup.document.write(“What can I say?”);
popup.document.close();
}
</script>
is46fig2
But how do you call the JavaScript function?
Functions can simply be linked to using the anchor tag. To link to the function in is46fig1, you would use the anchor:
<a href=”javascript:pop_window(‘page.htm’)”>Open a Popup Window
or
<a href=”javascript:pop_window(‘ ‘)”>Open a Popup
Window</a>
In the First example, the function is named “pop_window” and the html file is named (‘page.htm’). Since there is no page specified in the second link, a blank page will be opened.
For IMS users, you can add these Scripts to an HTML text Object and then link to them by assigning the link to any Object in the Object Editor. The link would look like:
“javascript:pop_window(‘page.htm’)” (without the quotes) Where page
is the HTML file you wish to open.
Steve White of http://www.IMSWebTips.com Virtual Mechanics & IMSWebTips offers DHTML tools and information, and also publishes a web tips ezine with lots of great ideas, snippets of code, and HTML and DHTML tutorials for any webmaster, regardless of experience.
