[TYPO3-german] Slider verdeckt Sticky-Menu

Björn Hahnefeld bjoern at hahnefeld.de
Tue Oct 4 09:50:12 CEST 2016


Die Sache mit dem CSS lasse ich vorerst mal lieber. Aber herzlichen Dank
für deine stets ausführlichen und nicht zuletzt kompetenten Antworten!

Es wird quasi - wenn ich es umbauen würde - beim Hover das andere Element
durch das "+" mitgesteuert (sozusagen Abhängigkeitsverhältnis) bei "#menu:hover
+ #content { opacity: .7; }"?

Am 4. Oktober 2016 um 06:30 schrieb Emil-WebDesign.net <etux at alice.de>:

> Quote: Björn Hahnefeld wrote on Mon, 03 October 2016 16:44
> ----------------------------------------------------
>
>> Grundsätzlich scheint das zu funktionieren :)!
>>
>> ABER: Es bleibt im Quelltext dann "class" im Tag stehen. Ist zwar die
>> Klasse entfernt, aber das Tag nicht sauber gelöscht... :(
>>
>
> Es bleibt nicht im Quelltext, weil es da nicht eingetragen werden kann. Du
> siehst es im Browser-Cache, nachdem der Browser den Quelltext verarbeitet
> hat.
> Theoretisch könntest Du statt „remouveClass" „removeAttr( 'class' )"
> nehmen, wenn Du sicher bist, dass „class" nicht woanders gebraucht wird.
> Ich verstehe aber nicht, warum Dich das überhaupt stört.
>
> Quote: Björn Hahnefeld wrote on Mon, 03 October 2016 17:03
> ----------------------------------------------------
>
>> Ich habe das einmal über meinen Content-Bereich eingefügt. Findest du
>> nicht, dass das durchaus geschmeidig aussieht? Übrigens habe ich dafür
>> keine Klasse angelegt, sondern die Änderungen direkt als Style (.css)
>> geschrieben. Ich meine, dass es nicht das Design stört... Was ist deine
>> Meinung?
>>
>
> Wolltest Du nicht die ganze Seite abdunkeln? ;)
> Darauf bezog sich auch meine Aussage.
>
> Ich finde alles gut, was die Bedienbarkeit steigert.
> Vom Optischen her, als nicht Designer, finde ich es ok.
> Ob es genug ist, um den Kontrast zu steigern, hängt vom Gerät und die
> Lichtverhältnisse der Umgebung ab.
> Mir kommt es ein wenig zu wenig vor. :)
>
>
> Wenn Du aber nur beim :hover verdunkeln willst, also ohne
> Tastatur-Unterstützung und nur dann wenn die JavaScript-Unterstützung im
> Browser an ist - ok, aber Du könntest den Effekt auch alleine per CSS
> regeln.
>
> #menu:hover + #content { opacity: .7; }
>
> Dabei entstehen zwei Problemchen: die aufklappbare Submenüs verstecken
> sich wieder hinter dem Slider ( #menu { opacity:  0.92; } und der
> Margin-Top bei den Sub ULs lässt eine Lücke (2px) entstehen  was bei
> Hover-Übergang auf die Submenüs problematisch werden kann.
>
> Ich habe nur schnell alles überflogen und nicht nachgeforscht woher
> #menu-sticky-wrapper her kommt usw. Daher so auf die Schnelle eine
> vorübergehende Lösung:
>
> ul.dropdown li ul {
>         /*margin-top: 2px;*/
>         margin-top: 0;
>         /*statt dessen padding*/
>         padding-top: 2px;
> }
> #menu:hover { opacity: 1; }
> #menu:hover + #content { opacity: .7; }
>
> Übrigens, der Umgang mit „opacity" ist nicht unproblematisch. Das hat
> seine Besonderheiten: das Element (und dessen Kindelemente) mit opacity
> kleiner 1, wird zuerst außerhalb des sichbaren Bereich berechnet und als
> letztes ins Viewport geholt. Dabei wird ein neues Stapel-Kontext etabliert.
> Usw.
> Und es lässt nicht nur den Hintergrund des Elementen durchsichtig werden
> (wie viele irrtümlich vermuten), sondern alles: Text, Border usw.
> Aber kein Problem, wenn man das alles weiß und kann. :)
> _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german


More information about the TYPO3-german mailing list