Part 4 - Browser Windows
Windows and HTML
Firstly you must know the two ways of creating a link which opens in a separate window. The most common use is to have:
<a href="link.html" target="_blank">Click Here</a>
This is the standard HTML code for opening a new window with the page in it.
A less common way of opening a new window is to use:
<a href="link.html" target="mywindow">Click Here</a>
This will create a new window, just like the first set of code, but it will also name the window 'mywindow'. This means that you can then have:
<a href="page2.html" target="mywindow">Change the page</a>
which, when clicked, will change the page which appears in the window you opened.
This means that a window called 'mywindow' will open with the page link.html in it, exactly like with the HTML code above.
I will give you more information about how this command works in a later part but for now all you really need to know is the following: In your standard HTML code include a link as follows:
<a href="#" onClick="window.open('link.html','mywindow');">Click Here</a>
As you can see this is just the same window.open command inside an HTML tag.
Manipulating The Window
There are many things you can include here. For example if you wanted a window that only has a location bar and a status bar (the part at the bottom of the browser) then you would use the following code:
There are many different things you can include in your new window:
|menubar||The File, Edit etc. menus at the top of the browser will be shown|
|scrollbar||This will show scrollbars at the side of the window if they are needed|
|width||You can set the width of the window in pixels (see the next section)|
|height||You can set the height of the window in pixels (see the next section)|
|toolbar||This will display the browser toolbar with the Back, Stop, Refresh buttons etc.|
|location||The location bar (where you type in URLs) will be displayed in the browser|
|resizable||This will allow the window to be resized by the user|
|directories||This will show the directories in Netscape browsers like 'Whats new' and 'Whats cool'|
Examples Of Manipulating Windows
This window will open with a location bar, toolbar and will be resizable:
window.open('window1.htm','the_first_window','location, toolbar, resizable');
This will open another page in this window:
This will open a window 200 pixels wide and 300 pixels high. It is not resizable and has a status bar and will scroll if necessary. This is a very commonly used combination:
1999 - 2001 FreeWebmasterHelp.com