Connecting Tech Pros Worldwide Forums | Help | Site Map

Making a div part of the "background"?

chardish@gmail.com
Guest
 
Posts: n/a
#1: Oct 15 '08
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
Guest
 
Posts: n/a
#2: Oct 15 '08

re: Making a div part of the "background"?


On 2008-10-15, chardish@gmail.com <chardish@gmail.comwrote:
Quote:
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@gmail.com
Guest
 
Posts: n/a
#3: Oct 16 '08

re: Making a div part of the "background"?


On Oct 15, 5:56*pm, Ben C <spams...@spam.eggswrote:
Quote:
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
Guest
 
Posts: n/a
#4: Oct 16 '08

re: Making a div part of the "background"?


On 2008-10-16, chardish@gmail.com <chardish@gmail.comwrote:
Quote:
On Oct 15, 5:56*pm, Ben C <spams...@spam.eggswrote:
Quote:
>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.
Quote:
Any way to change this and make it scroll when the page scrolls?
Of course:

http://www.tidraso.co.uk/misc/backgroundDiv2.html
mobleyreporting@gmail.com
Guest
 
Posts: n/a
#5: Oct 16 '08

re: Making a div part of the "background"?


On Oct 16, 9:32*am, Ben C <spams...@spam.eggswrote: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@gmail.com
Guest
 
Posts: n/a
#6: Oct 16 '08

re: Making a div part of the "background"?


Quote:
On Oct 16, 9:32*am, Ben C <spams...@spam.eggswrote:
>
Quote:
Of course:
>
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
Guest
 
Posts: n/a
#7: Oct 16 '08

re: Making a div part of the "background"?


On 2008-10-16, mobleyreporting@gmail.com <mobleyreporting@gmail.comwrote:
Quote:
>
Quote:
>On Oct 16, 9:32*am, Ben C <spams...@spam.eggswrote:
>>
Quote:
Of course:
>>
>
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.
Quote:
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@gmail.com
Guest
 
Posts: n/a
#8: Oct 16 '08

re: Making a div part of the "background"?


On Oct 16, 2:13*pm, Ben C <spams...@spam.eggswrote:
Quote:
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.
Closed Thread