Hamburger Menü - Farbe bei Hover

reni

Hallo - ich schon wieder

Heute Abend: das Hamburger Menü (wie kommt man auf so eine Bezeichnung ... )

Meine Menü-Einträge werden ja so schön grün hinterlegt beim Hover. Jetzt hätte ich das auch gern mit diesem Hamburger.

Gesucht hab ich schon ganz viel hier im Forum und mit den Werkzeugen, komme aber immer nur auf die einzelnen Einträge - zum Beispiel:

CSS

#appMenu-customize-button:hover {
text-shadow: inherit;
background: #0bb911 !important;
color: white !important;
}

Klappt wunderbar, aber das müsste ich jetzt für jedes einzelne Element machen.

Das geht doch bestimmt auch anders, oder? Leider hab ich die richtige ID dazu noch nicht gefunden

Könnt ihr helfen?

milupo

Zitat von reni

Klappt wunderbar, aber das müsste ich jetzt für jedes einzelne Element machen.

Im Normalfall ja und wenn du es nicht machst, muss es ein Anderer machen.

Aber es gibt ja eine Komplettlösung dafür. Andreas hat dir in irgendeinem Beitrag einen Link zu einer Sammlung von Anpassungen für Menüs angegeben. Da ist auch eine für das Hamburgermenü dabei:

https://github.com/Endor8/CSS/tre…r/Hamburgermenu

reni

Danke und das sieht schon schick aus, aber ist nicht so das, was ich wollte.

Es soll eigentlich nur grün werden bei Hover - so als Beispiel:

Geht aber vielleicht gar nicht so einfach, wie für die Menüs der Menüleiste.

milupo

Zitat von reni

Es soll eigentlich nur grün werden bei Hover - so als Beispiel:

Wie, wenn ich mich recht erinnere, Andreas schon an anderer Stelle schrieb, musst du dann auch die Regel ohne :hover angeben. Es empfiehlt sich auch background-color statt einfaches background anzugeben, da background eine Sammeleigenschaft ist.

2002Andreas

Zitat von reni

Das geht doch bestimmt auch anders, oder?

Teste bitte mal:

CSS

#appMenu-mainView toolbarbutton:hover,
#appMenu-mainView .toolbaritem-combined-buttons:hover { 
   background-color: green !important;
   color: white !important;
}

reni

Zitat von 2002Andreas

Teste bitte mal:

CSS

#appMenu-mainView toolbarbutton:hover,
#appMenu-mainView .toolbaritem-combined-buttons:hover { 
   background-color: green !important;
   color: white !important;
}

Ja genau, das ist es.

Vielen Dank, Andreas

reni

Und so werden auch alle Submenüs beim "Hovern" grün/weiß

CSS

/* Hover Schrift und Hintergrund Hamburger Menü */
#appMenu-mainView toolbarbutton:hover,
#appMenu-mainView .toolbaritem-combined-buttons:hover,
.subviewbutton:hover,
.widget-overflow-list .toolbarbutton-1:hover {
background-color: #0bb911 !important;
color: white !important;
}

Danke 2002Andreas für den Schubs in die richtige Richtung.

2002Andreas

Zitat von reni

für den Schubs in die richtige Richtung.

Gerne doch, dann weiterhin viel Spaß dabei.

Hamburger Menü - Farbe bei Hover

Ähnliche Themen

Schriftfarb-Wechsel bei Hover gewünscht

Hoverfarbe und Hintergrund der Menüs anpassen

Firefox 81: RestartFirefox.uc.js funktioniert nicht

hover Farbe in 3 Strich Menü und menüleiste ?

auf Amazon einen Submit Button bei hover die Farbe ändern in CSS Datei ?

titlebar-close in Farbe bei hover ?