In this tutorial I’m going to show you how to create a pop up window using java script. There are many tools to do this but most of them create pop up windows that open when a page loads. These are fine for pop up ads but what do you do when you want to open up a pop up window when a user clicks a link? This tutorial will show you how to write a function to do this.
This will be a function and it will be embedded in a standard java script tag.
<script LANGUAGE="JavaScript"> </script>
Now before we start lets look at the whole source code, then I will explain it all
function launch(){
jim=window.open("http://www.hardwaretutorials.com/","Hardware Tutorials","width=400,height=300,top=0,left=0,resizable=no,
scrollbars=yes,menubar=no,toolbar=no,status=no,location=no")}
Thats the function in full. Lets start at the beginning. The variable name is ‘Jim.’ Inside the window.open part there are all the configurable components of the pop up window. Lets start with the address. In our example I used http://www.microsoft.com but you could relace this with ‘www.yoursite.com’ or ‘information/popuppage.htm’.
The name for the window (the name that will appear before the title appears) for my example is Microsoft. Now is the window settings. You can set the width and the height as well as the top and left margin. You can also choose whether the window is resizable, scrollbars, a menu bar, a tool bar, a status bar and a location bar.
Once you have configured these just put them in a standard tag, in either the body or head tag.
<script LANGUAGE="JavaScript">
function launch(){
jim=window.open("http://www.microsoft.com","microsoft","width=400,height=300,top=0,left=0,resizable=no,
scrollbars=yes,menubar=no,toolbar=no,status=no,location=no")}
</script>
Thats the full code. Now all you need to do is create a link ‘javascript:launch().’ If you want to change the java script to ‘function whatever()’ instead of function launch(). You must do this if you have more than one pop up scripts on one page as you will need each hyperlink to activate a different pop up script.
Don't have time to check my blog? Get a weekly email with all the new posts. This is my personal blog, so obviously it is 100% spam free.
Tags: javascript, web
This entry was posted on Monday, December 30th, 2002 at 2:22 pm and is filed under Programming, Tech. You can follow any responses to this entry through the RSS 2.0 feed. Both comments and pings are currently closed.