-
Frame Linkage Hell.. Help a newb.
Alright. I'm messing around with some CSS that I haven't tried before. So here's what I am trying to accomplish. I have a fixed header, mid-section, and footer. The midsection is a scrolling frame. In the header I have links that, god willing, would change this scrolling mid-section. Well, I can't seem to figure it out. I have been attempting to follow the instructions on this site:
http://tutorials.alsacreations.com/frames/
Either I am too hungry and tired tonight to make it work or it simply isn't explained well.
All I can seem to get it to do is do NOTHING when I click the link. Before it would just go to the "page not found." Small victory I guess. Is there an easier way? If not, can someone please explain it in dumb blonde terms for me?
Please help!
-
-
can you post a link or your code and i could explain it by that and if i can not I'm sure someone else here can.
-
-
some of the code..
Ok so some of this is just copy and pasted from the website above. I am attempting to use and image map in my header as my menu...so that's why there is so much information there....the top one is the one I have been experimenting with all the other links are null/void and unchanged.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Four zones with scroll</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
@import url("4zones_scroll.css");
-->
</style>
</head>
<body background="images/fs-594-2.bmp">
<div class="conteneur">
<div class="header"><img name="header330" src="images/header33.gif" width="850" height="100" border="0"
usemap="#header33" alt="" />
<map name="header33">
<area shape="rect" coords="633,56,664,91" href="copy of movies.php?page=about" alt="Z's">
<area shape="rect" coords="615,56,633,92" href="http://pltmr.webs.com/z.html" alt="Z's">
<area shape="rect" coords="592,56,612,93" href="http://pltmr.webs.com/y.html" alt="Y's">
<area shape="rect" coords="567,55,589,90" href="http://pltmr.webs.com/x.html" alt="X's">
<area shape="rect" coords="539,56,565,89" href="http://pltmr.webs.com/w.html" alt="W's">
<area shape="rect" coords="515,56,536,89" href="http://pltmr.webs.com/v.html" alt="V's">
<area shape="rect" coords="493,57,513,88" href="http://pltmr.webs.com/u.html" alt="Us">
<area shape="rect" coords="473,53,489,91" href="http://pltmr.webs.com/t.html" alt="T's">
<area shape="rect" coords="451,57,468,90" href="http://pltmr.webs.com/s.html" alt="S's">
<area shape="rect" coords="427,57,447,89" href="http://pltmr.webs.com/r.html" alt="R's">
<area shape="rect" coords="402,58,423,94" href="http://pltmr.webs.com/q.html" alt="Q's">
<area shape="rect" coords="374,58,397,94" href="http://pltmr.webs.com/p.html" alt="P's">
<area shape="rect" coords="348,57,370,92" href="http://pltmr.webs.com/o.html" alt="O's">
<area shape="rect" coords="325,58,346,92" href="http://pltmr.webs.com/n.html" alt="N's">
<area shape="rect" coords="287,60,320,92" href="http://pltmr.webs.com/m.html" alt="M's">
<area shape="rect" coords="269,53,284,91" href="http://pltmr.webs.com/l.html" alt="L's">
<area shape="rect" coords="243,53,264,92" href="http://pltmr.webs.com/k.html" alt="K's">
<area shape="rect" coords="222,52,239,97" href="http://pltmr.webs.com/j.html" alt="J's">
<area shape="rect" coords="205,53,218,90" href="http://pltmr.webs.com/i.html" alt="I's">
<area shape="rect" coords="178,51,201,91" href="http://pltmr.webs.com/h.html" alt="H's">
<area shape="rect" coords="151,56,176,100" href="http://pltmr.webs.com/g.html" alt="G's">
<area shape="rect" coords="132,54,147,96" href="http://pltmr.webs.com/f.html" alt="F's">
<area shape="rect" coords="108,59,129,95" href="http://pltmr.webs.com/e.html" alt="E's">
<area shape="rect" coords="81,56,104,94" href="http://pltmr.webs.com/d.html" alt="D's">
<area shape="rect" coords="58,62,77,92" href="http://pltmr.webs.com/c.html" alt="C's">
<area shape="rect" coords="30,54,52,93" href="http://pltmr.webs.com/b.html" alt="B's">
<area shape="rect" coords="4,62,27,95" href="http://pltmr.webs.com/a.html" alt="A's">
</map>
</div>
<div class="frame" ?php
if (!isset($_GET['page'])) $page= 'about'; else $page= $_GET['page'];
switch($page)
{
case 'about': include ('a.htm');break;
case 'presentation': include ('presentation.htm');break;
case 'suite':include ('suite.htm');break;
case 'fin':include ('fin.htm');break;
}
?>
</div>
<div class="footer"><center>Brought to you by Team Grr Inc.</center></div>
</div>
<a href="copy of movies.php?page=index">Home</a>
</body>
</html>
-
-
Need this file code also 4zones_scroll.css. To recreate the page on my computer.
Also the page not found might have been a better victory your links are incorrect so the pages wouldnt be found so it might actually work.
-
-
I have the .css file. And the top link should work, I don't expect the others to work but I just didn't feel like going through and changing all the different links to work when I wasn't sure even one would.
So the goal was to get the top link to work, but it doesn't.
-
-
I do not have the css however and can not put that in to the code you provided me so I don't know exactly how the page looks still.
-
-
Well i just attempted to load it up onto the web so you could get a visual...but...alas while it loads up on my computer sans the internet, when I upload it, it just shows code.
pltmr.webs.com/movies2.php
maybe i'm just too dumb to use css.
-
-
oh and here is the .css code
/* CSS from tutorials of www.alsacreations.com/articles */
body {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
background-color: #fff; /*white background color*/
}
.conteneur { /*global content of the page, which will be centered */
width: 850px;
position: absolute;
left: 50%;
margin-left: -425px;
}
.header {
height: 100px;
background-color: #99CCCC;
}
.menu {
position: absolute;
left:0;
width: 150px;
height: 300px;
background-color:#CCCCFF;
}
.frame {
width: 850px;
height: 550px;
background-color:#cfbfb2;
overflow: auto;
}
.footer {
height: 20px;
background-color: #554539;
}
p {
margin: 0 0 5px 0;
}
.menugauche {
list-style-type: none;
margin: 0;
padding:0;
}
.menugauche li {
margin-bottom: 5px;
}
.menugauche a {
margin: 0 2px;
color: #000000;
text-decoration: underline;
}
-
-
There's nothing wrong with your code... It functions as it should. This tutorial was to show the overflow:auto as a frame would with the outer elements staying in the same place and the center content being scrollable. You have to make all the other pages with the same divs and in the frame div put in the content that is differnet from the other pages. The css will not load another pages content into one div if you want that you need to use frames....or java I think could do it I don't think php could...there's probably some other languages that could but I dont know them off hand. Also your code might be showing up like that if your server does not support php.
-
The Following User Says Thank You to bluewalrus For This Useful Post:
-
Wow. Ok. So I misunderstood. I was reading that so many people are anti iFrames and that this code sequence is a better way to go. I beg to differ. Thank you so much for clearing this up. I thought they acted as an actual CSS-type frame...but in fact it doesn't do much of anything. Thank you so much for clearing this whole fiasco up for me, I have wasted so much time 
Again, Thank you and happy holidays.
-
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
Bookmarks