WWW FAQs: How do I make a link that opens a new window?

2006-09-19: Opening a new window when the user clicks on a link is easy. All you have to do is add the right target attribute to the link.

An ordinary <a> link, like this one, causes the browser to open the new page in the same browser window:

<a href="http://www.boutell.com/">Visit Boutell.Com, Inc.</a>

If we give the link a target attribute, we can follow the link in a new window:

<a href="http://www.boutell.com/" target="outside">Visit Boutell.Com, Inc.</a>

This link will open a new window the first time it is used and give that window the name outside. This isn't something the user sees— it's just a special window "nickname" for you, the web designer.

If we click on a second link that also has a target of outside, and the outside window is still open, it will be used again.

Most of the time, this is a good thing— users don't like dozens of windows piling up as they navigate your site. But if you do want to force a completely new window for every click, you can use the special target value _blank (don't forget the _). _blank always opens a new, unnamed window.

For more advanced uses of the target attribute, see how can a link in one window send another window to a new page?

It's also possible to open new windows of a specific size, to center those windows, and to resize a window so that the useful space inside matches your layout. See the articles how do I open a new window of a certain size, how do I center a browser window on the screen, and How do I make the window size match my layout?

Legal Note: yes, you may use sample HTML, Javascript, PHP and other code presented above in your own projects. You may not reproduce large portions of the text of the article without our express permission.

Got a LiveJournal account? Keep up with the latest articles in this FAQ by adding our syndicated feed to your friends list!