This preview shows page 1. Sign up to view the full content.
Chapter 14 Frames Outline Goals and Objectives Chapter Headlines Introduction Frame Layout and Design Frame Sets and Nesting Using Frames Target Frames and Windows Summary Chapter 14 - Frames 2 Goals and Objectives Goals Understand frames, their creation and control, their use in navigating web pages and controlling content location in browser window, and their relationship to layers Objectives Positioning and coordinate systems Creation Layout Design Management Nesting Control Navigation
Chapter 14 - Frames 3 Chapter Headlines 14.1 Introduction Use frames when you have to 14.2 Frame Layout and Design Learn how to control frame layout 14.3 Frame Sets and Nesting Learn how to nest frames for better control 14.4 Using Frames XHTML makes using frames easy 14.5 Target Frames and Windows Find out what you can do using frames
Chapter 14 - Frames 4 Introduction Right sides of web pages are not effectively utilized When a surfer clicks on a link, from a set of links, the browser displays the corresponding HTML file in a new web page, which may not have the same links, for further navigation Frames solve this problem Frames divide a browser window into regions, with each region having its own web page Now a days all the browsers support frames Chapter 14 - Frames 5 Frame Layout and Design A frame has width, height, location, and content Frame size is usually fixed A frame set, a collection of frames, controls the layout of its frames A frameset and a frame are created using the <frameset>, and <frame> tags respectively The <frameset> tag replaces <body> tag Useful tips: Keep the frameset simple Keep frame content short Have a driver frame
Chapter 14 - Frames 6 Frame Sets and Nesting A frame set width is defined by number of columns, cols A frame set height is defined by number of rows, rows Units of rows and cols can be pixels or percentage of browser window Frame set consist of frames that are placed from the frame set origin starting from top left corner Nesting frames involves dividing the browser window in both directions multiple times There is no limit on depth of nesting Too much nesting is usually not necessary
Chapter 14 - Frames 7 Frame Sets and Nesting Chapter 14 - Frames 8 Frame Sets and Nesting Chapter 14 - Frames 9 Using Frames There are 4 XHTML tags that can be used <frameset> - Encloses all other frame tags Attributes: rows, cols <frame> - Creates a frame in a frame set Attributes: name, src, noresize, scrolling, frameborder, marginwidth, marginheight, longdesc <iframe> - Creates an inline frame Attributes: name, src, width, height, align, scrolling, frameborder, longdesc, marginwidth, marginheight <noframes> - specifies alternative content for a browser Attributes: NO ATTRIBUTES Chapter 14 - Frames 10 Using Frames Example 14.1: Using frames Create a web page that uses frames Chapter 14 - Frames 11 Using Frames Example 14.2: Creating nested frames Create a web page that nests frames Chapter 14 - Frames 12 Target Frames and Windows Frames optimize web page layout and facilitate navigation Contents of some frames may never change and that of others may change frequently Frames offer convenience to web surfers Target frames receive content from other frames Target frames must be given names when they are created i.e. use name attribute of the <frame> tag The source frame can then refer to a target frame by its name i.e. use target attribute
Chapter 14 - Frames 13 Target Frames and Windows Chapter 14 - Frames 14 Target Frames and Windows Example 14.5: Use target frames Illustrate the use of target frames Chapter 14 - Frames 15 Summary Frames divide a browser window into regions A frame has a width, height, location and content Frame sets include other frames Frames can be nested Using frames offers convenience to the web surfer Source frames direct their results to target frames Chapter 14 - Frames 16 ...
View Full Document
This note was uploaded on 07/01/2011 for the course COMP 103 taught by Professor Mulhimaldoori during the Spring '11 term at American Dubai.
- Spring '11