Menü Hintergrund bei aktiver Auswahl

[hansderwill]

Habe ein kleines Problem, weiss nicht ob das überhaupt möglich ist nur mit CSS.

Habe ein Menü in Form einer Liste, vereinfacht:

Code: Alles auswählen

<ul id="navigation">
   <li class="selectedcat_level1">Kategorie 1</li>
      <ul class="ul_level1">
         <li class="selectedcat_level2">Subkategorie 1</li>
            <ul class="ul_level2">
               <li class="selectedcat_level3">SubSubKategorie 1</li>
               <li class="cat_level3">SubSubKategorie 2</li>
               <li class="cat_level3">SubSubKategorie 3</li>
            </ul>
         <li class="cat_level2">Subkategorie 2</li>
         <li class="cat_level2">Subkategorie 3</li>
      </ul>
   <li class="cat_level1">Kategorie 2</li>
   <li class="cat_level1">Kategorie 3</li>
</ul>


Hier ist jetzt alles bis zur dritten Subkategorie aufgeklappt. Gewünscht wäre, das die ausgewählte Subkategorie-Einträge durch eine Hintergrundfarbe betont werden. Also jeweils nur alle li in einer ausgewählten ul ohne, dass die li der ul darüber betroffen sind. Ist das überhaupt möglich mit CSS so umzusetzen?

Besten Dank für euren Unterstützung schon mals, hoffe habe mein Anliegen einigermassen verständlich erklären können.

[sejuma]

Ich habe deinen Spezialfall noch nicht ausprobiert.
Aber generell sollte es nach diesem System
http://www.ohne-css.gehts-gar.net/0016.php
klappen, indem du anstelle des einzelnen li der jeweiligen ul-Ebene einen entsprechenden ID zuweist.

[hansderwill]

Besten Dank für deinen Hinweis. Allerdings trifft die verlinkte Antwort nicht ganz zu. Wenn es mehr als 2 Ebenen hat soll nur die tiefste markiert werden.

EDIT: denke wohl werd so oder so dem ul die Klasse zuweisen müssen und den php Teil dementsprechend anpassen, sehe sonst keine logische Lösung für das css, wird mir langsam klar.

Wie in meinem Beispiel, vielleicht ein bisschen zu undurchsichtig, kriegt das Ausgewählte li Element eine eigene Klasse. Oben sieht man bis zur 3. Ebene gewählte li Elemente. Alle weiteren li Elemente der tiefsten Unterkategorie innrthalb der ul , (bei z.B. 3 gewählten alle innerhalb von ul_level2), sollen einen Hintergrund erhalten, ungefähr so:

- Kategorie 1
-- Subkategorie 1
---- SubSubKategorie1
---- SubSubKategorie2
---- SubSubKategorie3
-- Subkategorie 2
-- Subkategorie 3
- Kategorie 2
- Kategorie 3

hier ist die Subkategorie 1 aus Kategorie 1 ausgewählt, welche noch 3 weitere Unterkategorien beinhaltet. (hier ist nur SubSubKategorie markiert, die eigentlich offene Subkategorie soll keinen Hintergrund haben)

- Kategorie 1
- Kategorie 2
-- Subkategorie 1
-- Subkategorie 2
-- Subkategorie 3
- Kategorie 3

Hier ist Kategorie 2 gewählt welche 3 Subkategorien beinhaltet.

Also sollen alle Elemente der Unter Liste hervorgehoben werden, jedoch so, dass falls es übergeordnete gibt, die höhere nicht.

Ist noch schwer sowas per Text zu erklären, hoffe mal es bringt ein bisschen Klarheit aber denke mal ich muss mich mit dem Aufbau der HTML Struktur dieser Navigation befassen um dieses Problem zu lösen