Simulate frame scrolling

Forum Moderators: not2easy

Message Too Old, No Replies

Simulate frame scrolling

onetry

1:40 pm on Feb 13, 2007 (gmt 0)

I saw on a site that it is possible to simulate a top frame always at the top. The remaining part of the page is "scrolled" down without affecting visibility of top div.

I analyzed the code trying to do the same with no luck.

Can you help me?

Regards.

limbo

1:27 pm on Feb 13, 2007 (gmt 0)

It's quite easy.

Absolutely position a container and give it z-index value higher than the content below (within another container). Then the absolutely positioned element will appear as a frame would.

The Contractor

1:50 pm on Feb 13, 2007 (gmt 0)

(I saw the site you had mentioned) Why not ask them? I see where they are doing it (you have to look at all the CSS files).

If you notice this particular implementation does not work in IE, but looks fine in Opera, NetScape, and FF.

onetry

1:55 pm on Feb 13, 2007 (gmt 0)

I tried this way:


<html>
<head>
<style type="text/css">
#header {position: absolute; top: 0; width: 600px; height: 200px; border: black solid 1px; z-index: 100;}
#content {position: absolute; top: 200; left: 0; width: 600px;border: black solid 1px;}
</style>
</head>
<body>
<div id="header">
Mitico
</div>
<div id="content">
Content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
Content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
Content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
Content<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
</body>
</html>

but it doesn't work.

SuzyUK

1:57 pm on Feb 13, 2007 (gmt 0)

ha! limbo answers before the question was asked - now that is clever ;)

there was an original question with the URL (not allowed sorry) and it that case they were also using position: fixed; which was fixing the header to the top of the screen - however IE6 and below doesn't support position fixed - does 7? I never checked

we do have a post in the library, which might help Emulating Frames - A working example [webmasterworld.com] It's a bit older and may well have better x-browser support now

Suzy

onetry

2:01 pm on Feb 13, 2007 (gmt 0)

you have to look at all the CSS files

I edited all css, through FF developer toolbar (very cool) but I didn't find it.

I'll look for again.