Downloaded 14 times
Uploaded byKapil Chawla
02 html-frames
This document discusses HTML frames. Frames allow dividing the browser window into multiple sections called frame cells. A frameset defines the layout of frame cells using rows and columns. Individual frames specify the content for each cell. Frames can be nested to create complex layouts. Links can target specific frames using the target attribute. Well known frame names like _top and _blank control window behavior. The document promotes customized Java training from its author and provides contact information.
![Bootstrap [part 1]](https://cdn.slidesharecdn.com/ss_thumbnails/bootstrappart-11-170208154053-thumbnail.jpg?width=640&height=640&fit=bounds)
02 html-frames
- 1. © 2009 MartyHall HTML Frames Customized Java EE Training: http://courses.coreservlets.com/ 2 Servlets, JSP, JSF 1.x & JSF 2.0, Struts Classic & Struts 2, Ajax, GWT, Spring, Hibernate/JPA, Java 5 & 6. Developed and taught by well-known author and developer. At public venues or onsite at your location. © 2009 Marty Hall For live Java training, please see training courses at http://courses.coreservlets.com/. Servlets, JSP, Struts Classic, Struts 2, JSF 1.x, JSF 2.0, Ajax (with jQuery, Dojo, Prototype, Ext, etc.), GWT, Java 5, Java 6, Spring, Hibernate/JPA, Hibernate/JPA and customized combinations of topics topics. Taught by the author of Core Servlets and JSP, More Servlets and JSP and this tutorial. Available at public JSP, tutorial venues, or customized versions can be held on-site at your Customized Java EE Training: http://courses.coreservlets.com/ Servlets, JSP, JSF 1.x & JSF 2.0, Struts Classic & Struts 2, Ajax, GWT, Spring, Hibernate/JPA, Java 5 & 6. organization. Contact hall@coreservlets.com for details. Developed and taught by well-known author and developer. At public venues or onsite at your location.
- 2. Agenda • • • • • • Advantages and disadvantagesof frames FRAME template Defining rows and cols in a FRAMESET Common FRAME and FRAMESET attributes Nested frames Targeting a document to a named FRAME cell 4 Frame Advantages • Certain parts of the interface (e.g., a TOC) are always on the screen l h • Can avoid retyping common sections of multiple Web pages • Consistent use across a large site sometimes simplifies user navigation • A convenient way to mix text-oriented HTML with Java applets • Image maps are more convenient if the map g y image remains on screen and only the results section changes 5
- 3. Frame Disadvantages • Themeaning of the “Back” and “Forward” buttons can be confusing • Poorly designed frames can get the user lost • Hard to find real URL of a page you want – Printing problems! • H d to bookmark " Hard t b k k "configuration" fi ti " • Some very old browsers do not support frames • Security – Hackers can insert frame cells into your pages in some circumstances, perhaps stealing information intended for your site 6 Frame Template <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"> <HTML> <HEAD><TITLE>Document Title</TITLE></HEAD> <FRAMESET ...> <!-- FRAME and Nested FRAMESET Entries --> <NOFRAMES> <BODY> <!-- Stuff for non-Frames browsers --> </BODY> </NOFRAMES> </FRAMESET> </HTML> 7
- 4. FRAMESET Attributes • COLS,ROWS – A comma-separated list of pixel values, percentages, and weighted remainders – FRAMESET entries should always specify at least two rows or columns. Netscape problems if not! – Examples <FRAMESET ROWS "50 10% * 2*" FRAMESET ROWS="50,10%,*,2*"> ... </FRAMESET> <FRAMESET COLS="25%,*,*"> ... </FRAMESET> 8 FRAMESET ROWS, Example <FRAMESET ROWS="50,10%,*,2*"> ... </FRAMESET> 9
- 5. FRAMESET Attributes (Continued) • FRAMEBORDER –I di Indicates whether borders will be drawn b h h b d ill b d between f frame cells – YES or 1 specifies borders; NO or 0 specifies no border – Can be overridden by FRAMEBORDER settings in individual FRAME entries – Often used in conjunction with BORDER 0 and BORDER=0 FRAMESPACING=0 • BORDER (Netscape), FRAMESPACING (IE) – S if th thickness of th border between cells Specify the thi k f the b d b t ll – Apply to outermost FRAMESET only • BORDERCOLOR – Sets the color of the border between cell, using either a hex RGB value or color name 10 Frame Border, Examples 11
- 6. FRAME: Specifying Contentof Frame Cells • SRC – URL of the d f h document to place i the f l in h frame cell ll • NAME – Supplies destination for TARGET attribute of hypertext links • FRAMEBORDER, BORDERCOLOR • MARGINWIDTH MARGINHEIGHT MARGINWIDTH, – Specifies the left/right and top/bottom cell margins, respectively p y • SCROLLING – Indicates whether cells should have scrollbars • NORESIZE – Disables the ability to resize the frame cells 12 Frame Example 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"> <HTML> <HEAD><TITLE>Frame Example 1</TITLE></HEAD> / / <FRAMESET ROWS="55%,45%"> <FRAMESET COLS="*,*,*"> <FRAME SRC="Frame-Cell.html"> <FRAME SRC "Frame Cell html"> SRC="Frame-Cell.html"> <FRAME SRC="Frame-Cell.html"> </FRAMESET> <FRAMESET COLS="*,*"> COLS= > <FRAME SRC="Frame-Cell.html"> <FRAME SRC="Frame-Cell.html"> </FRAMESET> 13 <NOFRAMES> <BODY> Your browser does not support frames. Please see <A HREF="Frame-Cell.html">non-frames version</A>. </BODY> </NOFRAMES> </FRAMESET> </HTML>
- 7. Frame Example 1,Result 14 Frame Example 2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"> <HTML> <HEAD><TITLE>Frame Example 2</TITLE></HEAD> / / <FRAMESET COLS="55%,45%"> <FRAMESET ROWS="*,*,*"> <FRAME SRC "Frame Cell html"> SRC="Frame-Cell.html"> <FRAME SRC="Frame-Cell.html"> <FRAME SRC="Frame-Cell.html"> </FRAMESET> 15 <FRAMESET ROWS="*,*"> <FRAME SRC="Frame-Cell.html"> <FRAME SRC="Frame-Cell.html"> / </FRAMESET> <NOFRAMES> <BODY> Your browser does not support frames. Please see <A HREF="Frame-Cell.html">nonframes version</A>. </BODY> </NOFRAMES> </FRAMESET> </HTML>
- 8. Frame Example 2,Result 16 Targeting Frame Cells • Specify the cell in which to place a page referenced by a hyperlink f db h li k • Th NAME Attribute of FRAME The Att ib t f <FRAME SRC="..." NAME="cellName"> • The TARGET Attribute of A HREF <A HREF="..." TARGET="cellName"> 17
- 9. Targeting Example 18 Cold-Fusion.html <!DOCTYPE HTMLPUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"> <HTML> <HEAD> <TITLE>Investing in Cold Fusion</TITLE> </HEAD> <FRAMESET ROWS="75,*"> <FRAME SRC="TOC.html" NAME="TOC"> <FRAME SRC="Introduction.html" NAME="Main"> <NOFRAMES> <BODY> This page requires Frames. For a non-Frames version, <A HREF="Introduction.html">the introduction</A>. </BODY> </NOFRAMES> </FRAMESET> </HTML> 19
- 10. TOC.html <!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>Table of Contents</TITLE> </HEAD> <BODY> <TABLE WIDTH="100%"> <TR><TH><A HREF="Introduction.html" TARGET="Main"> Introduction</A></TH> <TH><A HREF="Potential.html" TARGET="Main"> Potential</A></TH> <TH><A HREF="Investing.html" TARGET="Main"> Investing</A></TH> <TH><A HREF="References.html" TARGET="Main"> References</A></TH></TR> </TABLE> </BODY> </HTML> 20 Targeting Example, Results 21
- 11. Predefined Frame Names •_blank – Load document into a new browser window • _top –C Causes the linked document to take up the whole browser h li k d d k h h l b window – Document will not be contained in a frame cell • _parent – Places document in the immediate FRAMESET parent – Same as _top if no nested frames • _self – Place document in current cell – Only necessary to override a BASE entry 22 Summary • Frames require a Frameset DOCTYPE for validation lid i • A FRAMESET can be divided either into columns or rows – To create both rows and columns use nested FRAMESETs • By giving a FRAME a name, documents can be targeted to the named frame cell – <FRAME … NAME="…"> – <A HREF="…" TARGET="…"> • Th There are four predefined frame names f d fi d f – _blank, _top, _parent, and _self 23
- 12. © 2009 MartyHall Questions? Customized Java EE Training: http://courses.coreservlets.com/ 24 Servlets, JSP, JSF 1.x & JSF 2.0, Struts Classic & Struts 2, Ajax, GWT, Spring, Hibernate/JPA, Java 5 & 6. Developed and taught by well-known author and developer. At public venues or onsite at your location.