Popup windows are a very useful feature for websites. They can help you to give prominence to something on your site that your user may not see otherwise. Maybe you want them to subscribe to your newsletter, or you are linking to another site and you want that your visitors stay on your site while visiting the other, then you use a popup window.
Popup windows are called with the window.open method. This method accepts three arguments; the url to open in the new window, the name of the window, and a string with the window properties separated by comas. Lets see an example:
<script language=”JavaScript”>
window.open(‘http://www.yahoo.com/’, ‘mywindow’, ‘width=500,height=300,’)
</script>
on the above example http://www.yahoo.com is the page we want to visit; mywindow the name of the window to host the url; and width=500,height=300 is the desired dimension of the window. Note that if you open several windows with the name mywindow, each page will be added on the same window one after the other. Some useful values that can be placed on the name argument are _blank (which opens a blank window; and _self which opens the page on the window thatis calling it. Note also that if you don’t specify any url an empty window will be opened.
The following table list the properties that can be defined:
You can open a new window after a user takes an action on your site, like clicking on a link. Check the following example.
<html>
<body>
<script language=”JavaScript”>
function popup()
{
window.open(‘http://www.yahoo.com’, ‘mywindow’, ‘width=400,height=200,scrollbars=yes,resizable=yes’)
}
</script>
<A HREF=“http://www.google.com” onClick=“return popup()”>Popup example</A>
</body>
</html>
What we have done in the above example is to attach our popup code to a function.
The function is called whenever someone clicks on the link by using the onClick event of the link.
0 comments