Javascript umgehen

[Tytomik]

Hallo Community,
ich habe mir einen Button mit CSS gestaltet. (:hover)
Allerdings möchte ich jetzt das sich ein dropdownmenü öffnet wenn ich drauf klicke. (Nicht :hover)
Mit JavaScript könnte ich es ja mit "onclick()" machen, allerdings würde ich gerne JavaScript vermeiden.
Habt ihr eine Idee?
Vielen Dank im Voraus.
Tytomik

 

[XraYSoLo]

Gibt es meines Wissens nicht. Pseudoklassen (auf die es ja im Endeffekt herausläuft), ändern nur optisch etwas, solange sie aktiv sind und (:hover, :active) und danach nicht mehr.
In gewisser Weise kann man das auch dynamisch mit einem statischen Menü und PHP machen, aber das wäre eine Zweckentfremdung.

Nils aka XraYSoLo

 

[Banana_Jones]

Stimme meinen Vorredner zu, onclick nur mit JS.

 

[Sentence]

Das geht mit CSS3, schau mal hier
Edit this Fiddle - jsFiddle

Ob das auch im IE geht, hab ich nicht getestet.

MfG

 

[Banana_Jones]

Das geht mit CSS3, schau mal hier
Edit this Fiddle - jsFiddle

Ob das auch im IE geht, hab ich nicht getestet.

MfG

Interessante Variante...

Wenn man auf die ganzen Transitions verzichtet, sollte es doch eigentlich auch in nicht-CSS3-Browser (theoretisch) funktionieren.

Die Grundidee ist clever, da bin ich so auch noch nicht drauf gekommen. Ist nur die Frage, wie zuverlässig das browserübergreifend funktioniert

 

[Sentence]

Moin,
durch die Transitions wird das ganze ja erst Möglich. Das eine wird aus- und das andere eingeblendet.
IE10 wird das evtl. können.

MfG

 

[threadi]

Außer Transition gibt es auch noch 3 andere Wege um per CSS klick-Events abzufangen:
CSS Click Events | Codrops

 

[Tronjer]

Ist ja schön und gut, dass sich so etwas theoretisch auch mit CSS bewältigen lässt. Nur wozu soll das gut sein? Diese ganzen Ninjatricks stammen noch aus einer Zeit, als das Netz überwiegend statischer Natur gewesen ist, und der IE eine Warnung ausgab, wenn er ein Script entdeckte. Seit dem Web 2.0 hingegen bauen Webseiten vermehrt auf Ajax, und mit HTML5 wird JavaScript noch weiter in den Vordergrund rücken.

 

[Sentence]

Hab das was ich gepostet hatte nochmal überflogen. Das basiert auf dem :focus hack. Die transitions sind unwichtig.

Aber, du hast recht Tronjer. Würde diese CSS "Hacks" auch nicht dafür nutzen.

MfG

 

[Banana_Jones]

Moin,
durch die Transitions wird das ganze ja erst Möglich. Das eine wird aus- und das andere eingeblendet.

MfG

ich hatte das jetzt so verstanden, dass das Dropdown bei :active eine Höhe bekommt und diese bei :hover auch behält. Geht :active und :hover verloren, ist die Höhe wieder 0. Und das die Transitions nur für den flüssigen Übergang benötigt werden.
Aber gut, so ganz im Detail hab ichs mir dann nicht angeschaut ;)

 

[Sentence]

Siehe mein vorherigen Post Banana_Jones ;)