One of the more common uses of the Window object is to open new windows or pop-ups. While these pop-up windows are quite annoying to users when you use them for advertising, they are quite useful when you integrate them into a web application for appropriate use.
Here is the syntax used to open a new window. We can use the window.open method for opening new windows.
window.open(url,name,features,history)All of the parameters that you pass in the open method are optional. If no parameters are passed, the browser opens a new about:blank window.
URL
The URL of the page to open in the new window. This parameter is optional.
Name
This parameter either specifies the target attribute or the name of the window. This parameter is optional. The following values are supported:
_blank– URL is loaded into a new window, default value_parent– URL is loaded into the parent window_self– URL replaces the current window_top– URL replaces any framesets that may be loadedname– The name of the window
Features
This set of parameters is used for most of the customization of the new window. More than one parameter can be passed by separating the list of values with a comma. This parameter is optional.
| Parameter | Description |
|---|---|
channelmode=yes|no|1|0 | Whether or not to display the window in theater mode. Default is no. IE only. |
directories=yes|no|1|0 | Whether or not to add directory buttons. Default is yes. IE only. |
fullscreen=yes|no|1|0 | Whether or not to display the browser in full-screen mode. Default is no. Must be in theater mode. |
height=pixels | The height of the window. Minimum value is 100px. |
left=pixels | The left position of the window. |
location=yes|no|1|0 | Whether or not to display the address field. Default is yes. |
menubar=yes|no|1|0 | Whether or not to display the menu bar. Default is yes. |
resizable=yes|no|1|0 | Whether or not the window is resizable. Default is yes. |
scrollbars=yes|no|1|0 | Whether or not to display scroll bars. Default is yes. |
status=yes|no|1|0 | Whether or not to add a status bar. Default is yes. |
titlebar=yes|no|1|0 | Whether or not to display the title bar. Default is yes. |
toolbar=yes|no|1|0 | Whether or not to display the browser toolbar. Default is yes. |
top=pixels | The top position of the window. IE only. |
width=pixels | The width of the window. Minimum value is 100px. |
History
Specifies whether the URL creates a new entry or replaces the current entry in the history list. This parameter is optional. The following values are supported: true and false.
With true, the URL replaces the current document in the history list. With false, the URL creates a new entry in the history list.
Example
Here is an example that can be used to open a small popup window.
<html>
<head>
<script type="text/javascript">
function openWindow() {
myWin = window.open('', '', 'width=400,height=300');
myWin.document.write("Hello!");
}
</script>
</head>
<body>
<input type="button" value="Open Window!" onclick="openWindow()" />
</body>
</html>
