Modifying and Resizing Frames

Team-Fly    

Macromedia® DreamWeaver® MX Unleashed
By Matthew Pizzi, Zak Ruvalcaba
Table of Contents
Chapter 7.  Framesets


It's easy to resize and modify the appearance of a frameset. The first thing you need is precise control over selecting each frame, and the best way to do that is with the Frames panel. You can open the Frames panel by choosing Window, Others, Frame. This launches the Frame panel as shown in Figure 7.12. Notice that the Frames panel provides you with a small representation of what the divided document looks like.

Figure 7.12. The Frames panel offers an easy way to select a particular frame.

graphics/07fig12.jpg

When the Frames panel is open, you can click any one of the quadrants to select the particular frame. In the Frames panel, if you click in the frame you want to select, you get a highlight border around the corresponding frame in the document.

Titling the Frameset

If you want to title a document, and you want that title to appear in the title bar of the browser window, you must title the parent frame. Selecting the parent frame can sometimes be a little tough. Here's what I recommend: in the Frames panel, click in the top-left corner of the frames, just underneath the panel's tab. That will select the parent frame. If you're having trouble selecting that way, you can always click in any one of the frames, and in the Tag Inspector docked at the bottom-left corner of the document window, click the <frameset> tag closest to the edge of the document window. When that tag is bold, as displayed in Figure 7.13, you'll have the parent frame selected. Then at that point, if you title the document and preview it in the browser, your title will appear in the title bar of the browser window, as shown in Figure 7.14.

Figure 7.13. With the <frameset> tag closest to the border of the document window highlighted, the parent frame is selected.

graphics/07fig13.jpg

Figure 7.14. After you title the parent frame, the title appears in the title bar of the browser window.

graphics/07fig14.jpg

You may want to title all your documents. As I mentioned earlier, it is possible for end users to add a particular frame to their favorites by contextual-clicking. If they return to a favorite that they bookmarked, the entire frameset will not be loaded, just the single document. When that document loads by itself, you may want it to have a title. You can select each of the frames by using the Frames panel. With each of the separate documents selected, you can title them differently in the toolbar.

Resizing Frames

When sizing frames, it's important to keep in mind how they are sized to begin with. Often, frames either have an absolute pixel size or they have a relative size. For example, if you had a frameset that consisted of a top and bottom frame, you could set the top frame to equal a specified pixel size. The bottom frame size would be relative to the size of the browser window.

All this talk about absolute and relative sizes is important. You must understand how this works if you plan to adjust the sizes of your frames.

The easiest way to change the size of a frame is to mouse over the border until your cursor changes to a two-way arrow; then click and drag. The only problem with resizing frames like this is that they're automatically converted into absolute sizes.

To avoid setting frames to absolute sizes by accident, you can resize them by using the Properties Inspector. Let's work with the frameset you saved earlier in this chapter. With that frameset open, you can highlight the entire frameset. Select the frameset by using the Frames panel, and click in the corner of the frame border inside the Frames panel. With the entire frameset selected, notice that sizing options are available through the Properties Inspector, as shown in Figure 7.15.

Figure 7.15. When the parent frame is selected, options for resizing the frames appear in the Properties Inspector.

graphics/07fig15.jpg

As Figure 7.15 shows, the Properties Inspector offers a small representation of the frames you have selected on the right side of the Inspector. In the case of Figure 7.15, you'll notice that the top frame in the representation is the one that is highlighted, so the information being displayed in the remaining areas of the Properties Inspector is referring to the top frame.

When you set a size for the frame, notice in the Properties Inspector that there is an area for Value and Units. The Units option offers a drop-down menu with three options: Pixels, Percentage, and Relative. Depending on the circumstances, your site design determines which one of these options you should choose.

As you can see from Figure 7.15, I added a navigation system to the top portion of the frame. Because there is content in the frame that should always be visible, set the appropriate Value to a pixel size Unit. It's an advantage to set it to a pixel size to maintain the integrity of the navigational design; buttons and other elements will never shift. Setting a frame to a pixel size is also referred to as an absolute size.

If you click the bottom frame, in the small frameset representation in the Properties Inspector, your options change to resize the bottom frame, as shown in Figure 7.16.

Figure 7.16. The Properties Inspector provides feedback based on which frame is highlighted.

graphics/07fig16.jpg

You have the same sizing options for setting a Value to whatever Unit you specify. In the situation with the bottom frame, it's generally a good idea to set it to Relative. This simply means it will size relative to the browser window and the top frame. If the browser window is too small, the bottom frame will resize; however, the top frame will not. It's a bit different than percentage. With a percentage value, the frame will always want to be the percent size that you specify of the browser window.

Resizing a Nested Frame

Resizing a nested frame basically entails the same steps; however, you must select the nested frameset. Again, the easiest way to select the nested frameset is to use the Frames panel. Using this panel, click the frame border toward the center of the panel, as shown in Figure 7.17. When the frameset is selected, the Properties Inspector offers the same options in the Properties Inspector shown in Figure 7.18.

Figure 7.17. Click toward the lower-center part of the panel to select the nested frame.

graphics/07fig17.jpg

Figure 7.18. The nested frameset is selected.

graphics/07fig18.jpg

Here you have options for sizing the columns. The typical way to size a frameset designed like this is to set the column on the left to an absolute pixel size and set the column on the right to a relative size.

TIP

For further information on resizing framesets, refer to the QuickTime movie located on the companion Web site http://www.dreamweavermxunleashed.com.


Deleting a Frame

After initially setting up the frameset, you may decide that you no longer need or want a particular frame. Deleting it is simple. Make sure that frame borders are visible; if they're not, choose View, Visual Aids, Frame Borders. Click and drag the frame border of the unwanted frame off the page. Voilà, the frame is deleted!


    Team-Fly    
    Top


    Macromedia Dreamweaver MX Unleashed
    Macromedia Dreamweaver MX 2004 Unleashed
    ISBN: 0672326310
    EAN: 2147483647
    Year: 2002
    Pages: 321

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