Javascript Window Object: How to open and close a new browser window using javascript?
Every web browser window and every frame within every window is represented by a Window object in Javascript.
Why to use Javascript Window Object?
Sometimes you need to open a new window in your application for some purpose. Here Javascript Window Object comes into play. Using Javascript window object you can open a new window in your HTML page.
Syntax and Explanation of Javascript Window Object
window.open('url', 'name of window', 'attribute1, attribute2')
1. url: This is the web address of the page you wish to appear in the new window.
2. name of window: You can name your new javascript window whatever you like.
3. 'attribute1, attribute2': You can set attributes or properties of the new window like below:
Javascript Window Object Attributes and Properties
Below is a list of the attributes you can use:
1. width=300: Use this to define the width of the new window.
2. height=200: Use this to define the height of the new window.
3. resizable=yes or no: Use this to control whether or not you want the user to be able to resize the window.
4. scrollbars=yes or no: This lets you decide whether or not to have scrollbars on the window.
5. toolbar=yes or no: Whether or not the new window should have the browser navigation bar at the top (The back, foward, stop buttons..etc.).
6. location=yes or no: Whether or not you wish to show the location box with the current url.
7. directories=yes or no: Whether or not the window should show the extra buttons. (what's cool, personal buttons, etc...).
8. status=yes or no: Whether or not to show the window status bar at the bottom of the window.
9. menubar=yes or no: Whether or not to show the menus at the top of the window (File, Edit, etc...).
10. copyhistory=yes or no: Whether or not to copy the old browser window's history list to the new window.
Example: How to open a new browser window using javascript window object?
<form>
<input type="button"
<input type="button"
value="Open a new window"
onClick="window.open('http://theprofessionalspoint.blogspot.com/','TheProfessionalsPoint','width=400,height=200,toolbar=yes,
location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,copyhistory=yes,
resizable=yes')">
</form>
onClick="window.open('http://theprofessionalspoint.blogspot.com/','TheProfessionalsPoint','width=400,height=200,toolbar=yes,
location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,copyhistory=yes,
resizable=yes')">
</form>
Example: How to close a new browser window using javascript window object?
<form>
<input type="button" value="Close Window" onClick="window.close()">
</form>
<input type="button" value="Close Window" onClick="window.close()">
</form>
No comments:
Post a Comment