|
<FRAMESET COLS="33.33%,33.33%,33.34%">
<FRAME SRC="http://www.yahoo.com">
<FRAME SRC="http://www.google.com">
<FRAME SRC="http://www.sreehome.com">
</FRAMESET>
| |
Save it with the name myfirstframe.html and then open myfirstframe your framed webpage will look like as rightside abvoe :-
In this frameset definition you have three webpages
which are not part of your documents and if you are willing
to make a frameset of your own documents then you may replace
the above websites with the webpage documents of your own
ex: c:/mydocuments/page1.html or d:/mydocuments/mywebpage.html etc
but you must have these documents in our computer and one more
thing is if the webpage is located in the same directory of this
framed page then you need not type all the location address of
document but just you type the name of the document with extention html or htm and it is enough for your trial framed
webpage.(you must save the frameset with a name with the
extention of .html or .htm )
To arrange your frames horizontally use the ROWS attribute in place of COLS. These attributes define
the shape of the frames as row heights or column widths.The width or height is expressed in pixels or percentage or somepart with percetage and remaining with asterix(*).
|
<FRAMESET ROWS="50%,50%">
<FRAME SRC="http://www.yahoo.com">
<FRAME SRC="http://www.google.com">
</FRAMESET>
| |
Save it with the name mysecondframe.html and then open mysecondframe your framed webpage will look like as rightside above :-
In the above example shows two frames placed within a
frameset. To create a more complex arrangement of web pages you can place a
frameset and its associated frames within another frameset. This is known as
nesting frames, and you can think of it in the same way as putting a table
within a table.
The following are two types of mixed framesets with the features of above two examples.
|
<frameset rows="50%,50%">
<frameset cols="33.33%,33.33%,33.34%">
<frame src="http;//www.yahoo.com">
<frame src="http://www.google.com">
<frame src="http://www.sreehome.com">
</frameset>
<frame src="http://www.ebay.com">
</frameset>
| |
|
<frameset rows="50%,50%">
<frame src="http://www.ebay.com">
<frameset cols="33.33%,33.33%,33.34%">
<frame src="http;//www.yahoo.com">
<frame src="http://www.google.com">
<frame src="http://www.sreehome.com">
</frameset>
</frameset>
| |
Linking Frames
The most important feature of the frames is linking frames by naming and targeting.example One frame is named as index frame with links when clicked to be opened in the other frame named as target frame.The naming is done in the frame definition document by using the Name attribute of the <FRAME> tag. example: You create a webpage with index.html and insert various links in this webpage.(all links to be targeted to be opened in another frame) You first name the frame where you are willing to open these links as mainarea.
<html>
<table width="50"align="left">
<tr><td>INDEXWINDOW</td></tr>
<tr><td><a href="lesson1.html" target="mainarea">lesson1</a></td></tr>
<tr><td><a href="lesson2.html" target="mainarea">lesson2</a></td></tr>
<tr><td><a href="lesson3.html" target="mainarea">lesson3</a></td></tr>>
</table>
</html>
Save this code as index.html and now create this frameset as follows:-
<frameset cols="90,*">
<frame src="index.html">
<frame src="lesson1.html" name="mainarea">
</freamest>
and save as frame5.html and when you open it looks like as follows:-
SOME SPECIAL TARGET NAMES USED IN FRAMES
TARGET="_blank"
(link to load into a new blank window)
TARGET="_top"
(link to load into the full body of window)
TARGET="_self"
(link to load in the same frame as the link.)
The noframe tag
Some browsers do not support frames to display the webpage in such browsers the framefree version of webpage is necessary and for this purpose the <noframe> tag is used inside the frameset tags. When a browser which do not recognises the frames will display the content inside the <noframe> tags and the browsers which support frames will ignore the content inside the <noframe> tags
FORMATTING FRAMES
The following attributes are used to format frames.
1)The important attribute of Frameset: FRAMEBORDER
frameborder="value"or in netscape "yes" or "no" In the internet explorer if the border is set at "0" the border will disappear. In netscape it is set as "no".
The following attributes can be applied to the tag.
2)SCROLLING="yes|no|auto"
This attribute allows you to give the frame a scrollbar or not. The default is 'auto', which lets the browser decide whether the frame needs scrollbars and display them where necessary.
3)NORESIZE
This attribute will prevent the user from resizing the frame. By default the user can resize frames by dragging the the frame edge to a new position.
4)MARGINWIDTH=pixels
This attribute sets the left and right frame margins in pixels. By default, the browser will decide upon appropriate margin sizes.
5)MARGINHEIGHT="pixels"
This attribute sets the top and bottom frame margins in pixels. By default, the browser will decide upon appropriate margin sizes.
6)FRAMESPACING="pixels"
This attribute sets clear space around the frame; defined in pixels.
To create a seamless join between frames set the FRAMESPACING, FRAMEBORDER and BORDER attributes all to zero, as in the example below.
<FRAMESET COLS="400,*" FRAMEBORDER=0 BORDER=0 FRAMESPACING=0>
<FRAME SRC="http://www.yahoo.com" >
<FRAME SRC="http://www.google.com">
</FRAMESET>
You copy the above code and save as testframe.html and open it you will see a framed webpage but the frames cannot be identified as no border and no space between them)
The <iframe> tag
You copy the folloiwng iframe tag and insert it anywhere in your webpage and find how it looks like example:- <iframe> src="http://www.yahoo.com" height="200" width="300" align="center">
The result of this tag is as follows:-
Here it is not shown because, if it is inserted, the page will end here remaining part will not be visible.(So you try it in your webpage)
|
