How to Open a Link in a New Window: Using JavaScript

Part 3: Use JavaScript to Open a Window

If you want to be more specific as to how the new window will look, you need to use JavaScript.

First you have to decide what you want the window to look like. You can pick from the following options:

• a menubar
• a toolbar
• the location bar
• the directories bar
• a status line
• scrollbars
• allow the window to be resized
• will the window close when the window that opened it closes
• width (in pixels)
• height (in pixels)
• alignment from the left of the screen
• alignment from top of the screen

You also need to know the URL where the HTML for the window is. And, you'll have to give your new window a name.

I have decided that I want a new window, called "open_window", 640x480, to open in the upper left corner of the screen that points to the front page of this site. I put the following HTML in the head of my document:

<script language="JavaScript">
<!-- hide
function openNewWindow() {
 popupWin = window.open('http://webdesign.about.com/',
 'open_window',
 'menubar, toolbar, location, directories, status, scrollbars, resizable, dependent, width=640, height=480, left=0, top=0')
}
// done hiding -->
</script>

And the following in the link:

<a href="javascript:openNewWindow();">return to front page</a>

See it in Action

Next Page > Using JavaScript > Page 1, 2, 3

Previous Features