How to use a click event instead of :hover
0 0 
Felix Riesterer
0 
Matthias Apsel
0 
Orlok
How to use a click event instead of :hover
Gunnar Bittersmann
TabellenkalkHello Experts,
how can i change the :hover to a click event ?
<!DOCTYPE html>
<html lang="de-DE">
<head>
<style>
ul{
list-style-type: none;
width: relative;
background-color: #000;
position: fixed;
height: 100%;
overflow: auto;
}
li a {
display: block;
color: #FFD166;
padding: 5% 1vmax 5% 15%;
font-size: 2vmax;
}
li a.active {
background-color: #ffdb00;
color: black;
}
ul li {
display: block;
position: relative;
}
li ul
{
display: none;
}
ul li a {
display: block;
padding: 1em;
white-space: nowrap;
color: #fff;
}
ul li a:hover
{
background: #2c3e50;
}
li:hover > ul {
display: block;
position: relative;
}
li:hover li
{
padding-left: 2em;
}
ul ul ul {
bottom: 100%;
}
</style>
<title>Sample</title>
</head>
<body>
<ul class="navigation">
<li><a href="#">1</a>
<ul>
<li><a href="#">1.1</a>
<ul>
<li><a href="#">1.1.1</a></li>
<li><a href="#">1.1.2</a></li>
</ul>
</li>
<li><a href="#">1.2</a>
<ul>
<li><a href="#">1.2.1</a></li>
<li><a href="#">1.2.2</a></li>
</ul>
</li>
<li><a href="#">1.3</a></li>
</ul>
</li>
</ul>
</body>
</html>
Thank you! Florian
-
Moin!
For the li-element you can change "onclick" the style (one way ist to add or remove a class) with javascript.
But i think the best way is to define the
:hoverand:focusfor the anchor (<a>), not for the list item<li>.In this case set the padding and margin for the list item to zero, add the padding and margin to the anchor and set the list-item-sign (if you need them) with
before::tho the anchor.Jörg Reinholz
-
@@Jörg Reinholz
one way ist to add or remove a class) with javascript.
Ein Weg? Der Holzweg.
Es sollte keine Klasse "hidden" gesetzt bzw. entfernt werden, sondern das
hidden-Attribut. Siehe Ende dieses Postings.But i think the best way is to define the
:hoverand:focusfor the anchor (<a>), not for the list item<li>.Inwiefern würde das lösen, dass das Untermenü einmal aufgeklappt auch aufgeklappt bleiben soll?
LLAP 🖖
--
„Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
„Hat auf dem Forum herumgelungert …“
(Wachen in Asterix 36: Der Papyrus des Cäsar)-
Moin!
Inwiefern würde das lösen, dass das Untermenü einmal aufgeklappt auch aufgeklappt bleiben soll?
Oh. Ich dachte, es geht ihm um die Farben...
Jörg Reinholz
-
-
-
Dear Floland,
how can i change the :hover to a click event ?
what is it exactly that you wish to achieve? You seem to look for a very specific approach which might prove disadvantageous because of its technical specifics so maybe a different approach should also be part of this discussion. Therefore again: What is it exactly that you wish to achieve?
Liebe Grüße,
Felix Riesterer.
-
Dear Floland,
how can i change the :hover to a click event ?
what is it exactly that you wish to achieve? You seem to look for a very specific approach which might prove disadvantageous because of its technical specifics so maybe a different approach should also be part of this discussion. Therefore again: What is it exactly that you wish to achieve?
Da ich mich auch für das Thema interessiere:
Wäre es ggf. machbar, in einem deutschsprachigen Forum deutsch zu sprechen?
Englischsprachige Fachforen gibt es wahrhaftig genug, wenn der TO hier fragt, wird er sicherlich deutsch verstehen.
Roland
-
-
Hallo Floland,
Eine deutschsprachige Internetseite erstellen wollen, aber in einem ebenfalls deutschsprachigen Forum auf englisch fragen - wie passt das zusammen?
relativeiat kein gültiger Wert fürwidth.Bis demnächst
Matthias--
Das Geheimnis des Könnens liegt im Wollen. (Giuseppe Mazzini)-
Eine deutschsprachige Internetseite erstellen wollen, aber in einem ebenfalls deutschsprachigen Forum auf englisch fragen - wie passt das zusammen?
Danke. Meine Rede. Roland
-
Eine deutschsprachige Internetseite erstellen wollen, aber in einem ebenfalls deutschsprachigen Forum auf englisch fragen - wie passt das zusammen?
Roland
-
Hallo Roland,
Eine deutschsprachige Internetseite erstellen wollen, aber in einem ebenfalls deutschsprachigen Forum auf englisch fragen - wie passt das zusammen?
Danke. Ein dreistes Crossposting also.
Bis demnächst
Matthias--
Das Geheimnis des Könnens liegt im Wollen. (Giuseppe Mazzini)
-
-
-
Hallo Floland
Wenn du deine Frage schon in mehreren Foren gleichzeitig stellst wäre es angebracht, in den jeweiligen Postings auf diesen Umstand hinzuweisen, damit sich potentielle Helfer nicht unnötige Arbeit machen. Cross-Postings ohne einen solchen Hinweis sind ganz schlechter Stil …
Gruß,
Orlok
EDIT: Wie Roland bereits festgestellt hatte. – Memo an mich selbst: ‚Erst lesen dann schreiben.‘
--
„Das Wesentliche einer Kerze ist nicht das Wachs, das seine Spuren hinterlässt, sondern das Licht.“ Antoine de Saint-Exupéry-
Hallo,
Erst lesen dann schreiben.
Oder wie es mein Matheprof bei jeder Klausur formulierte: "Dreimal lesen, zweimal rechnen, einmal schreiben!"
Gruß
Kalk-
@@Tabellenkalk
Erst lesen dann schreiben.
Oder wie es mein Matheprof bei jeder Klausur formulierte: "Dreimal lesen, zweimal rechnen, einmal schreiben!"
Wichtiger als die genauen Zahlen ist aber die genaue Reihenfolge.
LLAP 🖖
--
„Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
„Hat auf dem Forum herumgelungert …“
(Wachen in Asterix 36: Der Papyrus des Cäsar)-
Moin!
Oder wie es mein Matheprof bei jeder Klausur formulierte: "Dreimal lesen, zweimal rechnen, einmal schreiben!"
Wichtiger als die genauen Zahlen ist aber die genaue Reihenfolge.
Ersetze "rechnen" durch "nachdenken" und bring das mal Juristen bei, die Richter geworden sind...
Jörg Reinholz
-
Ersetze "rechnen" durch "nachdenken" und bring das mal Juristen bei, die Richter geworden sind...
Jörg Reinholz
Haha, dich möchte man nicht als Feind haben
-
-
-
-