Want to print this page? Use this version instead.
Lets say you just want to open a window containing "page2.htm"
Lets talk about some of the attributes we can add to the above script to control not only the size of the opened window, but also, what is to be shown: toolbar, menu bar etc. To add attributes when a window is opened, we still would use the window.open() method, but with a little addition:
As you can see, we first have to add in a name (this name has nothing to do with adding attributes-it is the window name used in the TARGET attribute of a <a> and <form> tag-don't worry about it, it is not commonly used). Moving on, here are the complete list of attributes you can add:
Here is an example that opens a window that's not only smaller in size, but with ONLY the menubar turned on:
Here is another example with no attributes turned on, except the size changed:
Play around with them, if you like, but I'll end it here.
To reload a window, use this method:
Here's an example:
I was almost tempted to provide an example!
The basic syntax when loading new content into a window is:
This is exactly the same as
<a href="yoururl.com></a> //if we use html
Lets provide an example, where a confirm box will allow users to choose between going
to two places:
After you open a secondary window, there is a connection between the original window and this newly opened one that allows you to cross-access objects/variables, properties of each window. But before we discuss how this is done, we need to first discuss window names, a very different kind from the one mentioned in the beginning of this section.
Look at below:
By giving this window a name using the above method, for example, "hello", it
will give you access to anything that's inside this window from other windows. Whenever we
want to access anything that's inside this newly opened window, for example, to write to
this window, we would do this: hello.document.write("hi!")
The radio buttons are here, but we have changed the bgcolor of another window...lets see the core code:
//for radio button3
The most important part is: win1.document.bgColor, which is what caused the bgcolor to change in the secondary window, instead of the one that contains the script. Also notice that we used another method, focus(), to bring focus to the second window every time it changes.
Here's the complete listing of the window object we touched upon in this tutorial: