lecture on: frames. frames versus tables frames allow part of the page, usually a navigation bar, to...

21
Lecture on: Frames

Upload: joanna-fisher

Post on 23-Dec-2015

224 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

Lecture on:

Frames

Page 2: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

FRAMES VERSUS TABLES

Frames allow part of the page, usually a navigation bar, to stay put

Page 3: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

The Requirements to Create Frames

A FRAMESET html document to create the overall layout

HTML documents to fill the areas implied in the frameset document

Page 4: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

Implication of frame structure

A document rendered by FRAMESET displays several web pages at once

FRAMESET replaces the BODY tag in your html file

Page 5: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

An Annotated Example<HTML> <HEAD> You aren’t putting any text above the

frame

</HEAD><FRAMESET> This sets up your structure <FRAME SRC=“topdoc.html”>in this frame the

FIRST time the page is loaded

<FRAME SRC=“bottomdoc.html”Ditto

</FRAMESET> note that Frameset is a container element

</HTML>…by default, the screen will split equally between your documents

Page 6: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

FRAMESET Attributes

ROWS=

COLUMNS=

BORDER= BORDERCOLOR=

Page 7: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

ROWS AND COLUMNS

Use ROWS= COLUMNS=if you don’t want screen split evenly

- pixels or percentages

- * -- lets HTML compute what’s left

Page 8: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

BORDERS

BORDER= (between pages on screen)

in pixels defaults to 5 BORDERCOLOR (of frames) defaults to gray on most browsers

Page 9: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

FRAME Attributes

SRC=

NAME=

MARGINWIDTH=MARGINHEIGHT=

Page 10: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

SRC

SRC= where to get the html page to fill this frame

If you don’t put SRC, the frame will be created but left blank

Page 11: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

NAME

Goes within the FRAME element

NAME=“framename”

By naming your frames, you make it possible to open links in them from any document anyplace on the screen

Page 12: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

A more complex FRAMESET Example

<FRAMESET COLS=“20% ,80%”> splits page vertically

<FRAMESET ROWS=“15%,* >splits the 20% horizontally <FRAME SRC=“logo.gif”> logo in the top 15% <FRAME SRC=“nav.gif” name=“menu”> nav in the

bottom 85% ; also names the frame so I can open links in it from elsewhere

<FRAMESET ROWS=“*” the 80% is all one row <FRAME SRC=“pagebody.html name=“main”> this

fills the right side

</FRAMESET>

Page 13: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

TARGET used with FramesLinks within documents open in the current

window

To override this, use TARGET

An example:

Among my hobbies are <A HREF=“porkers.html” TARGET=“main”> pigs </A>,<AHREF=“peeps.html” TARGET=“main”> chickens

</A>……

Page 14: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

TARGET Reserves 4 Words_BLANK

loads the page into a new browser window

_SELF

loads the page into the current window.

_PARENT

loads the page into the frame next up from the frame the link is in

_TOP

loads the page into the full browser window.

Page 15: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

Hint

If you misspell the target the browser will create a new window for your link

INSTEAD OF loading it in the current page

Page 16: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

Minor FRAME Elements

MARGINWIDTH=

MARGINHEIGHT=

SCROLLING=

Page 17: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

Padding within Frames

MARGINWIDTH= pads frames side to side

MARGINHEIGHT= pads frames top to bottom

Both expressed in pixels

Page 18: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

The Scroll Bar

SCROLLING=“auto” is the default; creates a scrollbar if page is longer than frame

SCROLLING=“yes” creates a bar all the time

SCROLLING=“no” suppresses the bar

Page 19: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

Two Disadvantages of Frames

1. The bookmark is fixed to the controlling FRAMESET document so you can’t bookmark the contents of the frames.

2. Not every browser is frames-capable

Page 20: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

The Frames-Incapable

1. Browsers older than Explorer 3.0 Navigator 2.0

2. Screen resolutions of less than 640 by 480 pixels

Page 21: Lecture on: Frames. FRAMES VERSUS TABLES Frames allow part of the page, usually a navigation bar, to stay put

Provide an Alternative for those Browsers

Before FRAMESET, code <NOFRAMES> <BODY> What you want them to see

instead…. </BODY> </NOFRAMES>