Lesezeichen-Symbolleiste - Text nur bei hover anzeigen

Hallo,

Ich habe mir die Icons angepasst und es gefällt mir. Meine Frage ist, ob es möglich ist, so eine Art Mouseover Funktion ein zu bauen. Damit der Name angezeigt wird (keine Einblendung).

Früher gab es immer eine FF Addon dafür. Wo die nur die Lesezeichen Icons angezeigt wurde und beim darüber fahren mit der Maus wurde die Lesezeichen normal angezeigt.

Danke für die schnelle Antwort! Ich meinte eher, dass was ich rot eingekreist habe. Sorry für die Verwirrung.

Zitat von 2002Andreas

Zitat von Kamui18

was ich rot eingekreist habe.

Teste bitte wieder:

CSS

#PlacesToolbarItems .bookmark-item > .toolbarbutton-text {
    visibility: collapse !important;
  }

#PlacesToolbarItems .bookmark-item:hover > .toolbarbutton-text {
    visibility: visible !important;
  }

Zitat von grisu2099

Bitte testen:

CSS

#PlacesToolbarItems label {
  display: none !important;
}

#PlacesToolbarItems .bookmark-item:hover label {
  display: flex !important;
}

Danke! Ihr seid Spitze!

Für mich hat der Code von grisu2099 funktioniert. Leider hat der Code von 2002Andreas nicht funktioniert.

Leider rutscht der Name ins Icon rein. Aber ich bin trotzdem schon so Zufrieden.

So sieht mein Code (mit eurer Hilfe) aus:

#PlacesToolbarItems label {
  display: none !important;
}

#PlacesToolbarItems > .bookmark-item > .toolbarbutton-icon {
  min-width: 12px !important;
  min-height: 12px !important;
  margin-left: -4px !important;
  margin-right: -4px !important;
}

#PlacesToolbarItems .bookmark-item:hover label {
  display: flex !important;
}

Vielen Dank! Jetzt passt es!

Final Code:

#PlacesToolbarItems label {
  display: none !important;
}

#PlacesToolbarItems > .bookmark-item {
  min-width: 12px !important;
  min-height: 12px !important;
  margin-left: -4px !important;
  margin-right: -4px !important;
}

#PlacesToolbarItems .bookmark-item:hover label {
  display: flex !important;
}

#PlacesToolbarItems > .bookmark-item > .toolbarbutton-text {
  visibility: collapse !important;
}

#PlacesToolbarItems .bookmark-item:hover > .toolbarbutton-text {
  visibility: visible !important;
}

Falls jemand Lust auf das gleiche hat wie ich.

Ich hatte früher einen ganz anderen Code, der zwar fast dasselbe gemacht hat aber nur der mir in der Chronik keine Websitenamen angezeigt.

Ohne diesen Befehl:

#PlacesToolbarItems .bookmark-item:hover label {
  display: flex !important;
}

Funktioniert das Hover nicht bei mir. Warum weiß ich nicht. Vielleicht liegt es daran, dass es die Firefox Version aus dem MS App Store (Win11) ist.

Ich hab es ausprobiert. Leider hatte es nicht den gewünschten Effekt.