Hi,
solch ein aufklappbares Menü, in dem nach Anklicken der Hauptmenüpunkte die Untermenüs beständig geöffnet bleiben, ist mit CSS und den dafür in Frage kommenden Pseudoklassen
:focus (
Element erhält Fokus) und
:active (
Element wird angeklickt) nicht realisierbar, da nach dem Loslassen der Maustaste vom überwiegenden Teil der Browser die Submenüs umgehend wieder versteckt werden. Der Nutzer erhält somit überhaupt keine Gelegenheit, darin die weiterführenden Verweise zu erreichen.
Hierfür wird, wie in dem genannten Beispiel, eine Javascript-Funktion benötigt, die das Ein- und Ausblenden der Submenüs steuert.
Lediglich mit der Pseudoklasse
:hover (
Element wird überfahren) ist es möglich, ein Untermenü geöffnet zu halten, solange sich der Mauszeiger über dem Hauptmenüpunkt bzw. dessen geöffneten Submenü befindet - siehe z.B.
CSS only vertical sliding menu.
Was die Kreise betrifft, so sind dies die Listenpunkte (Bullets) der
<ul>-Elemente (Aufzählungsliste), die sich mittels
list-style-type:none oder
list-style:none deaktivieren lassen.
Die voreingestellten Abstände (Einrückungen) der Listenelemente werden mit Hilfe von
margin-left:0 und
padding-left:0 zurückgesetzt.
mfg Maik