Menu nach oben hin öffnen lassen

Moin,

im Gegensatz zu einem "Dropdown-Menü", dessen Untermenü mit der top-Eigenschaft seine Startposition von oben erhält, und sich nach unten öffnet, benötigt das Untermenü in der entgegengesetzten Ausrichtung die "gegenüberliegende" absolute Positionsangabe bottom.

Hier zwei praktische Beispiele:

CSS: 
.menu ul li ul {visibility:hidden; position:absolute;}
.menu ul li:hover ul, .menu ul li a:hover ul {visibility:visible; bottom:26px; left:0;}
CSS: 
.menu ul ul {
visibility:hidden;
position:absolute;
bottom:31px;
left:0; 
width:150px;
}

Wichtig ist hierbei zu beachten, dass das <li>-Element der oberen Menüebene mit position:relative formatiert ist, damit sich die absolute Positionsangabe seines Untermenüs relativ verhält, also auf dieses Element, und nicht auf den Dokumentkörper <body> bezieht.

mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück