HTML

Uses of the New Window Command for Web Sites

This article talks about opening new windows on a web page. There are a number of reasons why we might want to do this. So let's think about why we need to open a link in a new window.

Author Info:

By: Stephen Davies

Poor Best

Rating:

/ 2

February 26, 2008

TABLE OF CONTENTS:

The <BASE ...> tag tells the browser to pretend that the current page is located at some URL other than where the browser found it. Any relative reference will be calculated from the URL through <BASE HREF="..."> instead of the actual URL. <BASE ...> goes in the <HEAD> section. The <BASE> tag has three attributes: id, href, and target.

e.g.

<base target="_blank" />

With the above code added inside the HTML <head>..</head>, all links in the web page will be opened in a new window, unless that link's target attribute is specified.

Caution:

The target attribute of the BASE tag is removed in the XHTML strict mode, so we can only use it in the transitional or framesets mode of XHTML. It will probably work fine in traditional HTML pages.

4. The last and the best approach is the JavaScript window.open() method.

JavaScript is an object-based programming language; it can be embedded in the HTML code and will be executed by the browser. The method that is used to open a new window is window.open(...), which is a JavaScript built-in method within the top level JavaScript object window.

Usage:

window.open(url, winName, features)

e.g.

window.open('http://www.yahoo.com', 'popWin', 'width=500, height=500,
menubar=no, toolbar=no, resizable=no');

</script>

Parameters explanation:

url - the destination / target url that will be opened in the window.

winName - specifies the window name; it can be empty or you can use the four special window names "_blank" / "_self" / "_top" / "_parent" if you want to open the window in a particular place.

Features - customizes the new window's feature.

Valid feature options:

Options	Description
width	specifies the width of the window
height	specifies the height of the window
menubar	denotes whether there will be a menu bar. (The menu bar is the line of items above labeled FILE, EDIT, VIEW, GO, etc.)
toolbar	denotes whether there will be a toolbar on the newly opened window. (The toolbar is the line of buttons at the top of the browser window that contains BACK, FORWARD, STOP, RELOAD, etc.)
location	denotes whether there will be a location bar on the newly opened window. (The location bar is the space at the top of the browser window where the page URL is displayed.)
scrollbars	denotes whether there will be scrollbars or not. I wouldn't make a new window that would need scrollbars anyway. I think it kills the effect.
status	denotes whether there will be a status bar
resizable	denotes whether the user can change the size of the window by dragging.