Astro Lesson #12: multiple.mayhem.with.fancy.frames
If you have been paying attention, the last lesson covered the basics
of putting frames into your web pages. retrogrrl stupidly, ah we mean
'generously', mentioned that if anyone wanted to discover the mysteries
of updating multiple frames, they merely had to email her (in a grovelly
kinda way) - and voila! She would spill the beans.
Who would have thought anyone would actually want to know this stuff - or that anyone
really reads these lessons come to think of it? Well, Andrew Ronayne! Come on down!
Yes, that's right - you won the grovel award of the week and so retrogrrl
has graciously provided the desired information for all to see - yes,
Andrew, you have to be a good boy and share your toys with the other
children!!
setting.up.the.set.up
This is one of those things were you actually have to think about it before you do it (just
like building a box girder bridge, or going to see your Auntie Marg in Oodnadatta)
In our example we will play with a page that already has 4 frames
- ooh that's a lot to consider for a start!. This means the following
must be set up ..
- A frameset to tell the browser how to display these 4 frames
- 4 html files that contain the content of each of these 4 frames
- A second frameset which will tell the browser what to change and what to then display
- A final html file that will be our replacement frame content
- A partridge in a pear tree
flamin.framin
Okay - you already know how frames work. What? You missed that lesson?
Nevermind - go HERE and then come back again.
Let's start, then, with item #1 - the main frameset.
<html>
<head></head>
<frameset rows="25%,50%,25%">
<frame src="andrew.html">
<frame src="ronayne.html" name="littleframes">
<frame src="andrew4.html">
</frameset>
</html>
Translation: We have 3 rows across the height of the browser window,
the first and third take up 25% of the window, and the middle one 50%.
The first frame will display "andrew.html" as it's content : the second
is different - it will call a file called "ronayne.html", which is in
fact our second frameset file and this controls the middle 2 of our
4 frames - we have further defined it by calling it a name (name-calling
in this instance is perfectly acceptable!) It's name is "littleframes"
- this is like giving a nickname to the space in which "ronayne.html"
lives.
The third frame will contain "andrew4.html".
Next we have our 4 html files - plus the final one which contains the
new frames innards. It doesn't really matter what goes in any of these
files - that's up to you. .. it could be text or graphics. For our example,
our first frame says "So you want to update more than one frame at a
time, Andrew Ronayne?". As you can see, we are getting as much mileage
out of poor Andrew as possible!.
<html>
<head>
<title>A test for the frames lesson</title>
</head>
<body bgcolor="lemonchiffon">
<font face="verdana,arial,helvetica" color="red" size="+2">
<div align="center">
So you want to update more than one frame at a time Andrew Ronayne?
</div>
</font>
</body>
</html>
Finally, let's look at our special extra frameset which we nicknamed "littleframes"
<html>
<head></head>
<frameset cols="50%,50%">
<frame src="andrew2.html">
<frame src="andrew3.html">
</frameset>
</html>
As you can see, this little frameset controls the middle 2 frames in
our lovely example. They are called "andrew2.html" and "andrew3.html"
and they are split 50/50 across the width of the browser window.
make.it.so!
So that's the bones of our little scenario ... the crowning glory involves providing a link
which will update the 2 middle frames - this we have put into our frame at the bottom of the
screen.
<html>
<head>
<title></title>
</head>
<body bgcolor="#ffcc99">
<font face="verdana,arial,helvetica" color="#993300" size="+2">
<div align="center">
Well, Andrew click
<a href="andrew5.html" target="littleframes">HERE</a>
to see the amazing results ...
</div>
</font>
</body>
</html>
Translation : It's simple ... when the link is clicked, a new file will be displayed
("andrew5.html") in the space that we nicknamed "littleframes", which means that whatever
was in "littleframes" before is blown away.
the.results!
The moment of truth - click the atom below to view our example frame set up - then click the
link to see the multiple frames update themselves in a magical manner!
Phew! Of course, if you are a clever sausage this can all be much more complicated - for instance,
the 2 middle frames could be replaced with 3 smaller frames .... though don't forget what we
said in our original frames lesson - ask yourself why you would be doing this in the first place.
If you are merely showing off your frame prowess - then forget it.
So there you have it Andrew Ronayne (we had to get it in just one more time!).
Go away now and meditate upon these mutterings - and look forward to next time when we discuss
- well, something ....
next.pod
copyright.wendy.phillips.1998-2000
|
