Beim Scrollen Abstand von Browserfenster erzwingen
Velvetia
- css
Hallo lieber Leute,
ich habe hier eine Logo-Maske, im Beispiel vereinfacht ein Kreis (position:fixed) in der sich beim Scrollen ein Verlauf von schwarz nach weiß vollzieht. Leider muss der Text darunter zwischen Maske und Verlauf oder über beiden liegen und ist somit beim Scrollen zu sehen, das möchte ich verhindern. Der Text soll normal zu scrollen sein (ist später mehr Text) aber eben nicht in der Maske zu sehen, also irgendwo unter der Maske verschwinden … Bis jetzt sind alle meine Versuche, leere Elemente als Abstandhalter, floats, clips usw. gescheitert. Vielleicht stehe ich auf dem Schlauch und sehe den Wald vor lauter Bäumen nicht? Vielleicht gibt es eine Möglichkeit einen Abstand zum Browserfenster oder zum fixierten Logo auch beim Scrollen zu erzwingen? Für jede Idee wäre ich sehr dankbar!
(CSS im HTML)
http://grauekatze.com/maske/
Om nah hoo pez nyeetz, Velvetia!
background-attachment: local; scheint mir eine Lösung zu sein. Wird leider vom FF nicht unterstützt.
Matthias
Om nah hoo pez nyeetz, Velvetia!
background-attachment: local; scheint mir eine Lösung zu sein. Wird leider vom FF nicht unterstützt.
Matthias
Hallo Matthias, Danke für die schnelle Antwort, aber leider verstehe ich gar nicht wie mir das weiterhelfen kann? Ich glaube es gibt zwei Möglichkeiten: entweder mein Text ist ÜBER dem Verlauf, dann bräuchte ich eine Lösung wie der Text im Bereich der Maske NICHT GEZEIGT wird beim scrollen. Oder mein Text ist UNTER dem Verlauf, dann bräuchte ich eine Lösung wie das lange background-image, der Verlauf, der normal mitscrollt nur in einem Ausschnitt, der im Broswerfenster auch beim scrollen fixiert bleibt, (unter der Maske) angezeigt wird. Weitere Ideen?
Wenn du nicht willst, das man den Text hinter der Maske sieht, warum ist sie dann tranzparent?
Vermutlich versteh ich dich nur falsch :s
MfG
bubble
Wenn du nicht willst, das man den Text hinter der Maske sieht, warum ist sie dann tranzparent?
Vermutlich versteh ich dich nur falsch :s
MfG
bubble
Hallo Bubble,
es gibt drei Ebenen: die Maske (Ebene 1) liegt über einem Verlauf (Ebene 2), den soll man hinter der Maske sehen. Das tut man auch, nur sieht man leider AUCH den Text, was nicht gewünscht ist. Der Text (Ebene 3), liegt im Browserfenster weiter unten und hat eigentlich nichts damit zu tun, aber beim scrollen ist er leider zwischen E1 und E2 zu sehen. Oder wenn man die Reihenfolge ändert über allen beiden. Unter die beiden Ebenen kann man den Text nicht legen, da er sonst von dem Verlauf verdeckt wird, der bis nach unten geht. Wenn man meinen Link bis anch unten scrollt, verscwindet bald der Text und man kann den gewüsnchten verlaufs-effekt besser sehen.
*velvetia
Ah, okay ich hab nun verstanden wie das ganze aufgebaut ist, und wo das Problem liegt. Allerdings fällt mir keine elegante Lösung ein. Mit Javascript ließe sich das zwar bewerkstelligen, widerspricht aber dem "elegant".
MfG
bubble
Ah, okay ich hab nun verstanden wie das ganze aufgebaut ist, und wo das Problem liegt. Allerdings fällt mir keine elegante Lösung ein. Mit Javascript ließe sich das zwar bewerkstelligen, widerspricht aber dem "elegant".
MfG
bubble
Hallo Bubble,
ja, vielleicht gibt es einfach keine elegante Lösung …
Hast du eine Idee welches (einfache) Script ich hier einsetzen könnte?
Danke,
alija