nicht angemeldet
Blur und verschachtelte Listen
Mahlzeit,
ich versuche grad, ein Aufklappmenü (pures CSS) so zu ändern, dass beim AUfklappen du vorherige Ebene per Blur-Filter unscharf wird. Bei mir wird aber auch die aktuelle Ebene unscharf, was ich ja nicht will.
Gewollt ist, die aktuelle Ebene ohne Blur, die Ebene darunter mit Blur.
Ein Beispiel auf [http://dabblet.com/gist/1b2b4c77069905430926@title=Dabblet]
Ich vermute mal, da wird der Filter vererbt, aber das Zurücksetzen des Filters auf 0 bringt keine Änderung. Da ich bisher nicht mit Filtern gearbeitet hab, weiss ich nicht, wo ich ansetzen soll.
--
42
42
-
-
Mahlzeit,
hat sich erstmal erledigt. Zumindest Chrome hat da nen Bug bei überlappenden Elementen. Sobald ein Effekt zugewiesen wurde (z.B. opacity oder filter: blur(), wird das überlappende Element transparent und dadurch gibts mit :hover Probleme.
Deshalb leg ich das Problem erstmal auf Eis.--
42 -
Hi,
ich versuche grad, ein Aufklappmenü (pures CSS) so zu ändern, dass beim AUfklappen du vorherige Ebene per Blur-Filter unscharf wird. Bei mir wird aber auch die aktuelle Ebene unscharf, was ich ja nicht will.
Natürlich wird sie, weil du das LI-Element blurst, das auch das Untermenü enthält.
Gewollt ist, die aktuelle Ebene ohne Blur, die Ebene darunter mit Blur.
Die „aktuelle Ebene“ wäre das erste A-Element im LI – wenn du nur das blurst, wird der „Rest“, also dein Untermenü, davon nicht betroffen.
Tausche den Selektor
nav#mainmenu > ul > li:hover
mal durch diesen hier aus:
nav#mainmenu ul > li:hover > a
– ist das so in etwa was dir vorschwebt?http://dabblet.com/gist/b71fe8e072dd5ffa752f
(Wenn du noch mehr Ebenen haben wirst, musst du den Selektor ggf. anpassen bzw. spezifischer fassen – und wenn die eigentlichen Menüpunkte auf der untersten Ebene nicht geblurred werden sollen, ebenfalls.)
MfG ChrisB
--
Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/-
Mahlzeit,
nav#mainmenu ul > li:hover > a
– ist das so in etwa was dir vorschwebt?Auf die Lösung bin ich dann auch gekommen, danke. Durch den beschriebenen Bug bin ich aber erstmal davon abgekommen.
--
42-
Hi,
Durch den beschriebenen Bug bin ich aber erstmal davon abgekommen.
Den habe ich in Chrome (v 36.irgendwas) nicht nachvollziehen können …
MfG ChrisB
--
Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/-
Mahlzeit,
Den habe ich in Chrome (v 36.irgendwas) nicht nachvollziehen können …
http://dabblet.com/gist/7df320ad089407247191
AKtuell hab ich zwar die dritte Ebene nach rechts geschoben, aber damit kannst du den Fehler nachvollziehen ;)
Zumindest unter Chrome 37 unter Linux tritt der auf.Die dritte Ebene ist praktisch ohne Hintergrund und das :hover reagiert auf die Ebene drunter.
--
42-
Mahlzeit,
Nachtrag: ich seh grad, beim ersten li passt es noch, bei den weiteren ist der Hintergrund weg. Allerdings nur mit filter: blur(). Ohne Filter ist dieses Transparenz weg.
--
42 -
Hi,
AKtuell hab ich zwar die dritte Ebene nach rechts geschoben, aber damit kannst du den Fehler nachvollziehen ;)
Ja …
Die dritte Ebene ist praktisch ohne Hintergrund und das :hover reagiert auf die Ebene drunter.
– in meinem Fiddle sehe ich aber keinen vergleichbaren Effekt … sicher, dass der Fehler bei Chrome liegt, und nicht in deinem CSS?
MfG ChrisB
--
Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/-
Hi,
– in meinem Fiddle
dabblet meinte ich natürlich.
MfG ChrisB
--
Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/ -
Mahlzeit,
– in meinem Fiddle sehe ich aber keinen vergleichbaren Effekt … sicher, dass der Fehler bei Chrome liegt, und nicht in deinem CSS?
Sicher bin ich nicht. Aber da der Effekt nur auftritt, wenn ich den Filter setze, vermute ich das.
Ich schau mir das bei Gelegenheit nochmal an. Danke fürs nachsehen :)--
42
-
-
-
-
-