kitty17794
01-01-2004, 08:34 PM
I was wondering, how would I do the top and bottom frames like this (with no dividor on the frames)(http://lionkingdomain.com/)
And also, how do I make the background do that thing where it moves with the site?
duckgirl
01-01-2004, 09:10 PM
The code on that webpage actually tells me it has 4 frames... there's a 1 pixel tall frame at the very bottom, effectively hidden. Here is code that would be easy for you to use:
<html>
<head>
<title>Controller HTML File</title>
</head>
<frameset rows="50,*,50" framespacing="0" border="0" frameborder="0">
<frame name="top-frame" scrolling="no" noresize target="middle" src="top-frame.html">
<frame name="middle-frame" target="middle-frame" src="middle-frame.html" scrolling="auto" >
<frame name="bottom-frame" scrolling="no" noresize target="middle-frame" src="bottom-frame.html">
<noframes>
<body>
<p>This page uses frames, but your browser doesn't support them.</p>
</body>
</noframes>
</frameset>
</html>
It is set up so that the top frame is 50 pixels, the bottom frame is 50 pixels, and the bottom is whatever is left of the window, which can change when you resize the window. You can change the pixel measurements to whatever you want. Of course, for this to work, you would put the code I gave you on one page, just like that. Then, you'd make 3 pages called top-frame.html, middle-frame.html, and bottom-frame.html. If you want to call them different things, make sure you change the code in the frameset (the code I gave you) so that the names there match the names of your document.
I think you meant that you wanted the text to scroll over the background, like it does there. In middle-frame.html, you would put this code:
<body background="image.jpg" bgproperties="fixed"> and use your own image as the background.
Actually, it's better to put it in a css stylesheet like so:
<html>
<head>
<style type="text/css">
body {background-image:url(image.jpg); background-repeat:repeat; background-attachment:fixed; }
</style>
</head>
<body>
Content of page here
</body>
</html>
And if you don't want the image to repeat, replace "repeat" with "no-repeat". See Lissa's CSS section for more info.