Working with Window Objects

Because windows are objects, you manipulate them just as you would any object.by using
JavaScript’s dot notation to apply one of the available methods to the window object you name:

window_name.method_name();

1. Opening Windows :

To open a window, use the open() method, which opens a window that has the characteristics you specify as parameters inside its parentheses:

var window_name =window.open("some_url", "html_name",feature1,feature2,feature3,...");

In this example, I’ve set up a variable called window_name to refer to the window we’re opening. When I want to use JavaScript to change or manipulate what’s inside the window, I’ll refer to this window as window_name. Here window_name is just a variable—you could use any valid JavaScript variable name, such as fido, in its place if you so desired

2.Manipulating the Appearance of New Windows :

The three parameters of the window.open() command control the new
window’s characteristics.

a) The URL Parameter : The first parameter is the URL of the page you want to appear inside the window when the window opens. If you’d like to open a window with the Book of JavaScript website, inside the <script> tags you’d write:

var window_name = window.open("http://www.bookofjavascript.com/", "html_name");

b) The HTML Name Parameter : The HTML name of the window (the second parameter inside the parentheses) is useful only if you want to load a page into the window when the user clicks an HTML link on a different page. For example, if you open a window using window.open() and use the second parameter to name the window my_window, you can then use an HTML link to load a page into your new window. To do this, put the HTML name of the new window into the
target attribute of the link. For example, clicking the following link loads the Webmonkey site into my_window:

<a href = "http://www.webmonkey.com/" target = "my_window">Put Webmonkey into my new window!</a>

You can also use the target element of the link tag to open windows without using JavaScript. For example, if a visitor clicks a link like the one above and you haven’t already opened a window named my_window with JavaScript, your browser opens a new window and loads the link. The downside to opening a window without using JavaScript is that you have no control over what the window looks like, and you can’t change it once you’ve opened it (except by loading another page into it from a link).

c) The Features Parameter : The third parameter in the window.open() command is a list of features that let you control what the new window will look like. This is where things start to get fun.

The features parameter lets you open a new window that includes all, some, or none of these features. If you leave out the third parameter (that is, you list just the first two parameters and nothing more—not even empty quotes), the window you open will have all the features you see and will be the same size as the previous window. However, if you list any of the features in the third parameter, only the listed features appear in the window you open. So if you open a window with the command

var book_of_javascript_window =window.open("http://www.bookofjavascript.com/","book_of_javascript", "resizable");

you’ll get a resizable window with the Book of JavaScript site in it. This window
will be the same size as the window from which you opened it, but will lack
the menu bar, status bar, scroll bars, and other features

If you want more than one feature, you can list them inside the quotes, separated by commas. Make sure to leave all spaces out of this string. For some reason, spaces inside a feature string cause some browsers to draw your windows incorrectly.

var pictures =window.open("http://bookofjavascript.com", book_of_javascript","width=605,height=350" );

Feature Effect
directories Adds buttons such as What’s New and What’s Cool to the menu bar. Some
browsers ignore this feature. Others add different buttons.
height = X Adjusts the height of the window to X pixels.
left = X Places the new window’s left border X pixels from the left edge of
the screen.
location Adds a location bar, where the site visitor can enter URLs.
menubar Adds a menu bar.
resizable Controls whether the visitor can resize the window; all Mac windows are
resizable even if you leave this feature out.
scrollbars Adds scroll bars if the contents of the page are bigger than the
window.
status Adds a status bar to the bottom of the window. Use the status
property of the window object, discussed later in this chapter, to
define what will be displayed in the status bar.
Toolbar Adds a standard toolbar with buttons such as back, forward, and stop.
Which buttons are added depends on the browser being used.
top = X Places the window’s top border X pixels from the top edge of the
screen.
width = X Adjusts the window width to X pixels.