Making a div part of the "background"?

Hello,

Is it possible to make a div part of the "background"? In other words,
I want it to always render if that part of the screen is showing, but
not create scrollbars under any circumstances. Furthermore, I want it
to obey the same positioning rules as a normal div. And (like a
background image) I don't want the presence of this div to shift other
elements over.

Cheers,
Evan

On 2008-10-15, chardish (AT) gmail (DOT) com <chardish (AT) gmail (DOT) com> wrote:

Hello,

Is it possible to make a div part of the "background"? In other words,
I want it to always render if that part of the screen is showing, but
not create scrollbars under any circumstances. Furthermore, I want it
to obey the same positioning rules as a normal div. And (like a
background image) I don't want the presence of this div to shift other
elements over.

Yes it is possible with some trickery. Here is an example:

http://www.tidraso.co.uk/misc/backgroundDiv.html

On Oct 15, 5:56*pm, Ben C <spams... (AT) spam (DOT) eggs> wrote:

Yes it is possible with some trickery. Here is an example:

http://www.tidraso.co.uk/misc/backgroundDiv.html

This is a great start! One issue, though: the box stays fixed to the
page when you scroll (at least, on FF3/win). This seems odd, even for
an absolutely-positioned div (as opposed to a fixed-position one.) Any
way to change this and make it scroll when the page scrolls?

Cheers,
Evan

On 2008-10-16, chardish (AT) gmail (DOT) com <chardish (AT) gmail (DOT) com> wrote:

On Oct 15, 5:56*pm, Ben C <spams... (AT) spam (DOT) eggs> wrote:
Yes it is possible with some trickery. Here is an example:

http://www.tidraso.co.uk/misc/backgroundDiv.html

This is a great start! One issue, though: the box stays fixed to the
page when you scroll (at least, on FF3/win). This seems odd, even for
an absolutely-positioned div (as opposed to a fixed-position one.)

Everything is not what it appears-- you're scrolling #main, not the
viewport.

So you get the effect of background-attachment: fixed which I didn't
know wasn't what you wanted. The background div doesn't scroll because
it's not inside #main.

Any way to change this and make it scroll when the page scrolls?

Of course:

http://www.tidraso.co.uk/misc/backgroundDiv2.html

On Oct 16, 9:32*am, Ben C <spams... (AT) spam (DOT) eggs> wrote:

Of course:

http://www.tidraso.co.uk/misc/backgroundDiv2.html

Beautiful! I'll have to point you to the final design when it's
public. I'm really, really excited about how smooth this is. Thanks!

Cheers,
Evan

On Oct 16, 9:32*am, Ben C <spams... (AT) spam (DOT) eggs> wrote:

Of course:

http://www.tidraso.co.uk/misc/backgroundDiv2.html

Hrm. This doesn't work in IE6 (surprise) and renders two scrollbars in
IE7 (that's a new one on me.) Works fine in Firefox 3, Opera 9,
Chrome, Safari 2.

I might just have to bite the bullet and load a separate stylesheet
for IE users. Sad.

On 2008-10-16, mobleyreporting (AT) gmail (DOT) com <mobleyreporting (AT) gmail (DOT) com> wrote:

On Oct 16, 9:32*am, Ben C <spams... (AT) spam (DOT) eggs> wrote:

Of course:

http://www.tidraso.co.uk/misc/backgroundDiv2.html

Hrm. This doesn't work in IE6 (surprise) and renders two scrollbars in
IE7 (that's a new one on me.) Works fine in Firefox 3, Opera 9,
Chrome, Safari 2.

I can't help you there. I only know CSS.

I might just have to bite the bullet and load a separate stylesheet
for IE users. Sad.

Well it's time they woke up and smelt the coffee.

On Oct 16, 2:13*pm, Ben C <spams... (AT) spam (DOT) eggs> wrote:

Well it's time they woke up and smelt the coffee.

Got it working using a separate stylesheet and some ugly hacks. The
new CSS doesn't validate, but since it's only loaded if the user is
running IE, who cares? Besides, my XHTML is still valid.