Making a div part of the "background"?

[chardish]

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

[Ben C]

On 2008-10-15, ch******@gmail.com <ch******@gmail.comwrote:

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

[chardish]

On Oct 15, 5:56*pm, Ben C <[e-mail]:

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

[Ben C]

On 2008-10-16, ch******@gmail.com <ch******@gmail.comwrote:

On Oct 15, 5:56*pm, Ben C <[e-mail]:

>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

[mobleyreporting]

On Oct 16, 9:32*am, Ben C <[e-mail]:

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

[mobleyreporting]

On Oct 16, 9:32*am, Ben C <[e-mail]:

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.

[Ben C]

On 2008-10-16, mo*************@gmail.com <mo*************@gmail.comwrote:

>

>On Oct 16, 9:32*am, Ben C <[e-mail]:

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.

[chardish]

On Oct 16, 2:13*pm, Ben C <[e-mail]:

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.