Adjusting New Window Placement


You learned how to control the attributes of new windows in Lesson 8 with the Open Browser Window behavior. By editing the HTML in Code view, you can also control the placement of those windows.

1.

Preview the explorations/poses.html document in your primary browser. Click the Uttanasana link in the first column.

A new browser window opens with a photograph of the yoga pose. You created a new window like this one using the Open Browser window behavior to select the fwd-fold.jpg file, but you had no control over the exact placement of the window. You can control the placement by adding certain parameters to the JavaScript code to place the window in an exact location on the visitor's screen.

2.

In the poses.html document, look in the Code view pane for the code that opens the new browser when the visitor clicks the link.

You can find the code by placing the insertion point in the linked "Uttanasana" text in the Design view pane. The corresponding code in the Code view pane will automatically become selected. It should be on line 106 in the Code view pane.

You'll see some code like this:

 <a href="#" onclick="MM_openBrWindow('images/fwd-fold.jpg','','width=405, ¬   height=605')">Uttanasana</a> 


3.

After the value of the height parameter, type a comma and the following code: top=0,left=0

Be sure to type the comma and code after the numeric value of 605 and before the single apostrophe. Do not include any spaces.

The top and left parameters position the window at the top and left side of the screen. Using a parameter of 0 places the new window at those coordinatesin the top-left corner of the screen.

The resulting code should look like this:

 <a href="#" onclick="MM_openBrWindow('images/fwd-fold.jpg','','width=405, ¬   height=605,top=0,left=0')">Uttanasana</a> 


4.

Save your page and test it in the browser.

The new window displays at the top and left corner of your screen.

Tip

The ¬ character signifies where the book needed to insert a line break so it could fit on the pageyou don't actually need to have a line break in your document. And you definitely don't need to type this character into your code.

5.

Change both new parameters to 200 and see the difference when you view the page in the browser.

The new window displays in a different position.

When defining the placement of a new browser window, be careful not to position the window too far down or too far to the right. Users who have smaller monitors might not be able to see your window if the coordinates place the window outside the dimension of their screen.




Macromedia Dreamweaver 8(c) Training from the Source
Macromedia Dreamweaver 8: Training from the Source
ISBN: 0321336267
EAN: 2147483647
Year: 2006
Pages: 326

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net