Hallo zusammen,
ich sitze jetzt seit über zwei Tagen an einem Problem das mich verzweifeln lässt - aber mal von vorne:
Ich nutze die hier beschriebene Technik der "Matrix-Navigation" (einer großen Datei mit allen Zustandsgrafiken der Navigation) um ein rein mit CSS formatiertes Menü zu erstellen: Navigation MatrixReloaded @ Dan Rubin’s SuperfluousBanter
Die Technik ist relativ leicht, je nach body-ID und hover-ID wird der Hintergrund verschoben um einen Hover-Effekt zu erzielen und um eine alternative Grafik für den gerade ausgewählten Bereich (also z.B. "Startseite", "Galerie", etc.) anzuzeigen damit dieser als ausgewählt angezeigt wird.
Soweit funktioniert das gut - HIER MEINE BISHERIGE NAVIGATION IN AKTION: CAPTION_LINE
Nun zu meinem Problem: Ich möchte dieser Navigation eine Dropdown-Funktionalität hinzufügen um weitere Unterpunkte zur Auswahl anzubieten.
Da die Navigation über eine ungeordnete Liste formatiert wird, wollte ich dem Ganzen eine weitere ungeordnete Liste hinzufügen (in der Form ul#nav li ul {weitere Anweisungen}).
Leider werden alle Informationen des "Mutter-UL/LI-Tags" auch an die weiteren Unterpunkte vererbt - so findet sich hier vor allem ein "overflow:hidden", welches verhindert das die gewünschte Dropdown-Liste über die Größe der Navigation heraus sichtbar ist und weitere Anweisungen in der LI-Formatierung die mir Kopfzerbrechen bereiten (und die Dropdown-Liste nicht erscheinen lassen).
Die relevanten CSS-Styles im Einsatz sind hier sichtbar: http://www.madpotato.de/test/_lang/de/style.css
Der HTML-Code (wie er mir vorschwebt) ist dieser:
Hat jemand eine Lösung für meine blinden Augen wie ich entweder der beschriebenen Matrix-Navigation die Dropdown-Funktionalität hinzufügen kann bzw. eine Möglichkeit die Vererbung dieser Attribute zu verhindern (wohl nicht möglich). Oder hat jemand einen Link zu einer alternativen, reinen CSS-basierten Navigation mit grafischen Hover-Effekten und Dropdown-Funktionalität?
Vielen Dank im Vorraus, jede Form von Input kann mir den Tag etwas leichter machen ! :)
ich sitze jetzt seit über zwei Tagen an einem Problem das mich verzweifeln lässt - aber mal von vorne:
Ich nutze die hier beschriebene Technik der "Matrix-Navigation" (einer großen Datei mit allen Zustandsgrafiken der Navigation) um ein rein mit CSS formatiertes Menü zu erstellen: Navigation MatrixReloaded @ Dan Rubin’s SuperfluousBanter
Die Technik ist relativ leicht, je nach body-ID und hover-ID wird der Hintergrund verschoben um einen Hover-Effekt zu erzielen und um eine alternative Grafik für den gerade ausgewählten Bereich (also z.B. "Startseite", "Galerie", etc.) anzuzeigen damit dieser als ausgewählt angezeigt wird.
Soweit funktioniert das gut - HIER MEINE BISHERIGE NAVIGATION IN AKTION: CAPTION_LINE
Nun zu meinem Problem: Ich möchte dieser Navigation eine Dropdown-Funktionalität hinzufügen um weitere Unterpunkte zur Auswahl anzubieten.
Da die Navigation über eine ungeordnete Liste formatiert wird, wollte ich dem Ganzen eine weitere ungeordnete Liste hinzufügen (in der Form ul#nav li ul {weitere Anweisungen}).
Leider werden alle Informationen des "Mutter-UL/LI-Tags" auch an die weiteren Unterpunkte vererbt - so findet sich hier vor allem ein "overflow:hidden", welches verhindert das die gewünschte Dropdown-Liste über die Größe der Navigation heraus sichtbar ist und weitere Anweisungen in der LI-Formatierung die mir Kopfzerbrechen bereiten (und die Dropdown-Liste nicht erscheinen lassen).
Die relevanten CSS-Styles im Einsatz sind hier sichtbar: http://www.madpotato.de/test/_lang/de/style.css
Der HTML-Code (wie er mir vorschwebt) ist dieser:
Code:
<ul id="nav">
<li id="sta"><a href="'.$myDomain.LINK_1.'">'.LINK_1.'</a></li>
<li id="gal">
<a href="'.$myDomain.LINK_11.'"></a>
<ul>
<li><a href="c">Test-Dropdown</a> <!-- MUSS SICHER ANDERS GEMACHT WERDEN -->
<ul>
<li><a href="d">Punkt 1</a></li>
<li><a href="e">Punkt 2</a></li>
<li><a href="f">Punkt 3</a></li>
<li><a href="g">Punkt 4</a></li>
</ul>
</li>
</ul>
</li>
... etc. etc...Hat jemand eine Lösung für meine blinden Augen wie ich entweder der beschriebenen Matrix-Navigation die Dropdown-Funktionalität hinzufügen kann bzw. eine Möglichkeit die Vererbung dieser Attribute zu verhindern (wohl nicht möglich). Oder hat jemand einen Link zu einer alternativen, reinen CSS-basierten Navigation mit grafischen Hover-Effekten und Dropdown-Funktionalität?
Vielen Dank im Vorraus, jede Form von Input kann mir den Tag etwas leichter machen ! :)
