Load 2 (or more) frames with one click - HTML method
If at all possible, use the HTML method. We will get into that first...
The idea is simple... the two frames that will be changed have been defined with a frameset doc. To change them, just load a new frameset doc.
Click the link below. Follow me step by step. I'll explain what's happening.
Here is an example.
The link first loads a directory page in the left frame and a frameset page in the right. The frameset page immediately loads 2 documents in that right frame: Joe's friend Bill and Joe's friend Ed.
Click the link to Jackie's friends.
This loads a whole new frameset doc (split2_jackie.html) into the right frame which immediately loads Jackie's friend Amy and Jackie's friend Joan into the frames.
You see, all you're doing is loading a new frameset doc when you click on a link. The framesets can be as complex as you wish. Click back and forth between Joe's friends and Jackie's friends.
Now click on More friends.
Oh my! What the heck happened?
Well... more of the same. Clicking on that link loaded an entirely new master page with the target being set as "_top". This loaded a new directory page in the left frame and a new frameset page in the right which in turn spilled 4 documents into those 4 right frames.
Click on John's friends. This loads a new frameset doc (split4_john.html) into the right frame which in turn loads John's friends. Clicking back and forth between Joe, Jackie, John and Jenny simply loads different framesets into the right frame. Clicking on the Less frames link re-loads the first master page.
Pretty neat eh?
The following documents were used in the above examples.
Thats about it for the HTML method. Remember, regardless of the method you choose, there's a lot of room for error here. Be meticulous and thorough. Test your setup completely before unleashing it on the world.
You want to tax yourself? Here's what you can do for some intense practice...
Put this little frames symphony together from scratch. Use the following outline...
Mammals Farm Animals Cow | Pig | Horse Big Game Bear | Moose Small Critters Mouse | Gerbil | Squirrel | Mole Plants Trees Maple | Oak | Fir | Cherry Flowers Daisy | Tulip | Rose Fruits Apple | Orange | Grapes | Peaches | Plums | Lemons Vegetables Cucumber | Green beans Fish Game fish Salmon | Bass | Walleye | Catfish Aquarium fish Goldfish | Guppies
A solution is here if you need it.
|Lessons: Intro 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19|
|Frames Templates HTML 4.0 Reference Barebones HTML Guide|