Thema: Mainmenu abändern?

Hallo Leute,

das Modul Mainmenu würde ich gerne abändern, doch leider reichen meine PHP-Kenntnisse nicht ganz aus. Wenn das Mainmenu erzeugt wird, ist das zweite Submenu dem erste Submenu untergeordnet. Ungefährt so:

</div id="submenu1">
</div id="submenu2"></div>
</div>

Frage wie muss ich den PHP-Code abändern, damit das verhindert wird?

Vielleicht blickt da jemand durch!?

Habe die Datei mal als txt angehängt.

Das Problem ist, wenn submenu2 in submenu1 steckt und submenu1 einen hover-effekt für den Hintergrund bekommt, dann ist der hover-effekt für submenu1 auch aktiv wenn ich über submenu2 schwebe. Oder täusche ich mich da?

Oje... war Dummheit!!!! Hat sich erledigt. Vielen Dank

Sorry, dass Problem besteht doch noch! Genau das was ich im Beitrag 3 angesprochen habe.

Das Problem ist, wenn submenu2 in submenu1 steckt und submenu1 einen hover-effekt für den Hintergrund bekommt, dann ist der hover-effekt für submenu1 auch aktiv wenn ich über submenu2 schwebe. Oder täusche ich mich da?

Vielen Dank für den Link

Dafür brauchst du kein neues Menü, geht alles per CSS:

Nehmen wir mal die folgende Struktur als Beispiel:

HTML-Code:

<div id="submenu1">
<a href="hierhin.html">Eintrag</a>
<div id="submenu2">
<a href="dahin.html">Untereintrag</a>
</div>
</div>

Wenn das jetzt (wie vermutlich in deinem Fall) mit diesem CSS Verknüpft wird:

HTML-Code:

#submenu1:hover {
   background-color: red;
}
#submenu1:hover {
   background-color: green;
}

Dürfte da der Effekt rauskommen, den du beschreibst. Diese Lösung ist aber zum einen aus den von dir genannten Gründen unschön, zudem unterstützt der IE 6 z.B. diese Pseudoklassen (:hover, :active, etc.) garnicht und IE 7 nur :hover.

Besser wäre also das :hover direkt auf den Menülink anzuwenden, etwa mit dieser CSS:

HTML-Code:

#submenu1 {
  margin: 0;
  padding: 0;  */ sämtliche Abstände, geerbte Rahmen und sowas auf 0 /*
}

#submenu2 {
  margin: 0;
  padding: 0; */ dito /*
}

#submenu1 a:hover {
  background-color: blue;
}

#submenu2 a:hover {
  background-color: blue;
}

Das funktioniert in fast allen Browsern und dürfte dem Effekt den du haben möchtest näher kommen

Gruß
Christian