Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

scrolling text underneath a fixed position element

scrolling text underneath a fixed position element

Problem

I am currently creating a one page website, however I am having an issue, I need the scroll text underneath the Fixed Element however you can see the text that should be dissapearing under the fixed position element, as the element as a back-ground, which is a transparent png, is there any way I can hide text as it scrolls underneath the fixed position element.

Here is a fiddle of what I have, so far

JS FIDDLE

Ideally I am wanting it so that when text moves behind the box with red borders it is not visisble, without the need for a Background color.

Problem courtesy of: Udders

Solution

I have visited your website and stolen some images to better understand what you are trying to accomplish.. Assuming i'm correct in the assumption you do not want a solid background on the header because it would mess with your pages background....

you can use multiple backgrounds...

see your demo

Solution courtesy of: rlemon

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

scrolling text underneath a fixed position element

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×