WebDevelopersNotes logo

home-icon Home / HTML / How to create HTML frames – Frames part 5

How to create HTML frames – Frames part 5

How to create HTML frames - Frames part 5

The NAME attribute

The name attribute of the <FRAME> tag helps us gives names to our frames so that they can be referenced. This is especially useful for client-side scripting using JavaScript or VBScript.

To see what NAME can do for us, we shall build upon our previous examples by introducing hyperlinks and loading contents using them.

Firstly, we shall make another file frames4.html. Check out its code:

<HTML>
<HEAD><TITLE>Intelligent Frames</TITLE>
</HEAD>
<FRAMESET COLS="20%, 80%">

   <FRAME SRC="menu2.html" NAME="menuframe">
   <FRAME SRC="home.html" NAME="mainframe">

</FRAMESET>
<NOFRAMES>
There is no frame support on your browser.
</NOFRAMES>
</HTML>

Note: We load menu2.html in menuframe and home.html in mainframe.

Secondly, we modify the navigational menu frame by adding hyperlinks.

<HTML>
<HEAD><TITLE>Menu</TITLE>
</HEAD>
<BODY BGCOLOR="#FFCCFF">

<A HREF="home.html" TARGET="mainframe">Homepage</A>
<BR>
<A HREF="lions.html" TARGET="mainframe">Lions</A>
<BR>
<A HREF="tigers.html" TARGET="mainframe">Tigers</A>
<BR>
<A HREF="bears.html" TARGET="mainframe">Bears</A>
<BR>

</BODY>
</HTML>

Note the TARGET attribute in anchor tag that specifies the mainframe, the name of our right frame.

Thus, when a link is clicked on the navigational frame, the contents of the linked document will be displayed in mainframe. If we skip to add this attribute, the contents will be loaded in the same frame that carries the link.

Play with the file and understand how this works. Click here.

Sponsored Links

Your comments
Star icon IMPORTANT Have a question / problem? Click here to ask an expert.

Browse, Browser, Browsest

Sponsored Links

Tips

How do I view a deleted web page?
Is there a way to view a deleted web page - one that is no longer available? Yes there is and the solution is quite simple. [more...]

Fact

The first program to incorporate WYSIWYG technology was Bravo. This document preparation program was developed for the Alto computer designed at the Palo Alto Research Center of Xerox. Though Bravo was never released commercially, its direct descendant was included in the Xerox Star. WYSIWYG, Ethernet, GUI, bitmap graphics and several computer technologies that we used today have been developed at the Xerox's Palo Alto Research Center (PARC). [more...]

We use cookies to give you the best possible website experience. By using WebDevelopersNotes.com, you agree to our Privacy Policy