CS-3432 Electronic Commerce Lecture – 9 Sikandar Shujah Toor

Frames Frames are used to divide a web page one the computer screen into number of portions and use each portion to display different information Information may be updated in one frame while stay static in other on the same page defines one window or portion within a In HTML tag does not have an end tag, however, a tag must end with tag can be nested to divide a webpage in different order “rows” and “cols” attributes are used in tag to divide the webpage horizontally and vertically respectively

Frame Attributes frameborder0/10 hides the border around the frame, 1 displays it longdescurlUrl of page which contains a long description of the contents of a frame MarginheightPixelSpecifies the top and bottom margins of a frame MarginwidthPixelSpecifies the left and right margins of a frame Name Specifies the name of a frame Noresize Frame is not resizable ScrollingYes /No / Auto Whether or not show the scroll bars on the frame Srcurlurl of the document to show in the frame ClassclassnameClass name for a frame Id Unique id for the frame StyleStyle_ Definition Inline style for an element TitleTextGives title to the frame

Dividing the Screen Horizontally Horizontal Frames

5 Dividing Screen Horizontally

Dividing the Screen Vertically Vertical Frames

Dividing Screen Vertically

Nesting of Frames Nesting of Frames /frameset>

Nesting of Frames

Nesting frames Nested Frames

11 Nesting of Frames

12 frames.html Horizontal Frames with Content

13 1st.html - Code This text is from 1st.HTML

2nd.html- Code Horizontal Frames with links This text is from 2nd.HTML This is a link to another html file

Frames with Varying Contents

3rd.html - Code Horizontal Frames This text is from 3rd.HTML This is a link back to 2nd.HTML

Frames with Varying Contents

Ready-made names for frames Target=“_self” Contents shown in the same window (frame) Target=“_top” Contents shown in the entire window Target=“_blank” This opens a new window for a frame

Images can be links, too Images Can Be Links, Too Click this house to return to my home page.

Image as a Link

Image Maps An image map is a web page graphics with several defined ‘clickable’ areas Three steps Determine coordinates of clickable regions Use the and tags Add a special version of the tag

Finding Coordinates

Image Coordinates ABC 0,0 199,0 399,0 599,0 199,99 399,99599,99

24 and Tags

25 Applying Tag

26 Shape Attribute Shape attribute also accepts values “Circle” and “Poly” (for a polygon)

Div Tag Main Title of Web Page Menu HTML CSS JavaScript Content goes here Copyright © W3Schools.com

Div Tag