Tripod
Tripod

   handcrafted

Vol. 2, No. 11
TODAY'S LESSON: Linking in Frames


Remember the whole <frameset> thing we got hung up on last time? How you laughed when we used <frame src>? How you cried for those poor <frames> people? If this isn't ringing bells, you probably need to do a little make-up work:

Handcrafted Newsletter Archive

Right, now that you're up in frames, you should be the proud owner of the following frame set:

<frameset cols="25%,75%">
<frame src="left.html" name="left">
<frameset rows="100,*">
<frame src="north.html" name="north">
<frame src="south.html" name="south" marginwidth="5"
marginheight="10" scrolling=auto>
</frameset>
</frameset>
<noframes>
<body>
You appear to be running a browser that can't see frames -- that 
is so 1996! I suggest you finally break down and upgrade to 
something a little more au courant.
</body>
</noframes>

Note that I've left off the HTML tags -- I did this because a lot of email programs view these tags as a command to present the email as an actual HTML page, not a text-only newsletter (readers who kept their eagle-eyes peeled may have noticed that we had a little trouble with this in the first frame lesson). So when you frame your own pages, make sure to drop in an opening HTML tag at the top and a closing tag right there at the end. Got that? OK, now get this: Next we're going to gussy up our frames with some hot link action!

>>> Link, Link, Nudge, Nudge <<<

The burrito-neat thing about frames is that they let you divide up the page into static areas, such as navigation bars, and areas where content rotates in and out. Users can follow a link that sits in page in a static section, and a new page rotates into one of the dynamic areas. The thing is, you must make it clear in which area you want what pages to load. To do this, you have to play the name game.

Our three frames are named "left," "north," and "south," and they each suck in a different HTML page (left.html, north.html, and south.html, respectively). The way we specify which region we want a page to load into is by "calling" that region's name. For example, if you want a link in the left frame to load a new page in the north, create a link within left.html that targets the north, like so:

<a href="nanook.html" target="north">Nanoo, nanoo!</a>

This loads nanook.html in the "north" frame.

What happens if you fail to specify a target frame? Well the new page is pulled into the same frame as the page that houses the link. In other words, if this link ...

<a href="nanook.html">Nanoo, nanoo!</a>

... appeared in left.html as it sat in the left frame, it would load nanook.html into the left frame.

If you want the new page to replace all the frames with one frame-less page, use target="_top" (as in, "load this page on top of the current frameset"), like this:

<a href="nanook.html" target="_top">Nanoo, nanoo!</a>

And if you want a page to load into a new browser window entirely, use "_blank":

<a href="nanook.html" target="_blank">Nanoo, nanoo!</a>

That about does it -- you now have everything you need to fill your frames with the all links you've been missing. We suggest you play around with them for awhile. See how many windows you can launch. Discover what happens when you pull another website into your frameset. Maybe even discover how easy it is to rebuild your entire site in frames.

But if as you explore you find your frames are still fogged up, the illustrations and blow-by-blow account in Webmonkey Jillo's tutorial should clear things up:

Linking in Framesets


Hints, Pointers, and Tips 'O the Trade

1. Two Birds, One Click

Want two separate pages to load in two different frames with just one click on a little ol' link? (For an example of what we're talking about, check out this page.

JavaScript's the answer. For example, if we changed our current link in left.html to ...

<a href="nanook.html" onClick="window.self.location='north.html'"
target="south">Nanoo, nanoo!</a>

... the nanook.html page will swap into the left frame, where left.html was sitting (which is what "window.self.location" means -- "onClick" pretty much means what you think it does: "when this linked gets clicked on"). At the very same time, north.html will migrate south for the winter.

For more info about how all this works, read what these Webmonkeys have to say about the matter:

Luke's "Changing Two Frames at Once"

Thau's "JavaScript Tutorial"

2. Three Birds Worth One in Hand

So, what do you do if you want all three frames to change with one click? If we were really mean, we'd send you off on a wild bird chase and have you build it all in JavaScript. But wouldn't it be a lot easier if you simply created a new frameset page and linked to that one on "_top" of everything? Huh.

3. Hard-earned Wisdom

Before you shut your trunk, always make sure your keys are right there in your hot little hand and not, say, in the pocket of the coat you just locked in the trunk.

 
Subscribe/Unsubscribe

Handcrafted Archive

2002 March
February
January
2001 December
November
October
September
August
July
June
May
April
March
February
January
2000 December
November
October
September
August
July
June
May
April
March
February
January
1999 December
November
October
September
August
July
June
May
April
March
February



    Tripod: Home | Site Map | About Tripod | International | Tripod Help | Report Tripod Abuse | Members | Angelfire Members

     » Lycos.com  © Copyright 2009, Lycos, Inc. Lycos is a registered trademark of Lycos, Inc. All Rights Reserved.
     About Lycos | Help | Jobs | Advertise

     Your use of this website constitutes acceptance of the Lycos Privacy Policy and Terms & Conditions