PHNjcmlwdCBhc3luYyBzcmM9Imh0dHBzOi8vcGFnZWFkMi5nb29nbGVzeW5kaWNhdGlvbi5jb20vcGFnZWFkL2pzL2Fkc2J5Z29vZ2xlLmpzP2NsaWVudD1jYS1wdWItNTc2MjY0MDc2NzM2NjUwMyIKICAgICBjcm9zc29yaWdpbj0iYW5vbnltb3VzIj48L3NjcmlwdD4=
Aktion: Ashampoo WinOptimizer 25 Kostenlos


Cgo8IS0tIHdpbmRvd3Nwb3dlciBtaXR0ZTIgbmV1IC0tPgo8aW5zIGNsYXNzPSJhZHNieWdvb2dsZSIKICAgICBzdHlsZT0iZGlzcGxheTpibG9jayIKICAgICBkYXRhLWFkLWNsaWVudD0iY2EtcHViLTU3NjI2NDA3NjczNjY1MDMiCiAgICAgZGF0YS1hZC1zbG90PSI3NzkzMjc1MTg2IgogICAgIGRhdGEtYWQtZm9ybWF0PSJhdXRvIgogICAgIGRhdGEtZnVsbC13aWR0aC1yZXNwb25zaXZlPSJ0cnVlIj48L2lucz4KPHNjcmlwdD4KICAgICAoYWRzYnlnb29nbGUgPSB3aW5kb3cuYWRzYnlnb29nbGUgfHwgW10pLnB1c2goe30pOwo8L3NjcmlwdD4K

Hat man die Sidebar aktiviert, dann ist diese permanent geöffnet. Bei kleinen Monitoren kann das ungünstig sein, weil der Platz dann für die Ansicht der Webseite fehlt. Mit einem CSS Code kann man die Sidebar per hover mit der Maus öffnen.

So sieht das standardmäßig aus:

sidebar standard

Firefox 83 – Sidebar per hover öffnen

userChrome.css und userContent.css erstellen

userChrome Dateien wieder nutzen



Als Erstes gehen wir dazu in den Profilordner vom Firefox, und öffnen dort den selber angelegten Ordner chrome.

Dann im Ordner chrome die userChrome.css Datei öffnen.

In diese Datei tragen wir nun folgenden CSS Code ein:

/*Sidebar per hover ausfahren*/

@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml"),
url("chrome://browser/content/browser.xhtml") {

#menu_bookmarksSidebar {
display: -moz-box !important;
}

#bookmarks-view-children {
margin-top: -120px !important;
margin-left: -15px !important;
}

.sidebar-placesTreechildren::-moz-tree-separator {
margin: 0px 500px !important;
}

#sidebar-box {
display: block !important;
position: fixed !important;
top: 126px;
bottom: -35px;
width: 0px !important;
overflow-x: hidden !important;
-moz-appearance: none !important;
border: 1px solid transparent !important;
border-left: 0 !important;
opacity: 0 !important;
transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
z-index: 2 !important;
}

#sidebar-box:hover {
width: 230px !important;
opacity: 1 !important;
transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
}

#sidebar-splitter {
display: none !important;
}

#sidebar {
display: block !important;
width: 100% !important;
height: 95%;
}
}

Und so sieht der Code dann in der userChrome.css Datei aus:

css code

Die Werte können beliebig verändert werden.

AVM FRITZ!DECT 210 (Intelligente Steckdose für Smart Home,...
  • Intelligente Steckdose für Smart Home, schaltet automatisch oder manuell die Stromzufuhr angeschlossener Geräte (bis 3. 450 Watt)

Firefox 83 – Sidebar per hover öffnen

Dann die userChrome.css Datei schließen und speichern, und den Firefox neu starten, damit die Änderung wirksam wird.

Wenn man jetzt mit der Maus an den linken Rand vom Desktop geht, öffnet sich die Sidebar und schiebt sich über die gerade geöffnete Webseite.

sidebar hover

Entfernt man die Maus wieder vom Rand, schließt sich die Sidebar automatisch, ohne dass sich die Position der Webseite verändert.

Wie hilfreich war dieser Beitrag?

Klicke auf die Sterne um zu bewerten!

Durchschnittliche Bewertung 0 / 5. Anzahl Bewertungen: 0

Bisher keine Bewertungen! Sei der Erste, der diesen Beitrag bewertet.

Share.
PHNjcmlwdCBhc3luYyBzcmM9Ii8vcGFnZWFkMi5nb29nbGVzeW5kaWNhdGlvbi5jb20vcGFnZWFkL2pzL2Fkc2J5Z29vZ2xlLmpzIj48L3NjcmlwdD4KPGlucyBjbGFzcz0iYWRzYnlnb29nbGUiCiAgICAgc3R5bGU9ImRpc3BsYXk6YmxvY2siCiAgICAgZGF0YS1hZC1mb3JtYXQ9ImF1dG9yZWxheGVkIgogICAgIGRhdGEtYWQtY2xpZW50PSJjYS1wdWItNTc2MjY0MDc2NzM2NjUwMyIKICAgICBkYXRhLWFkLXNsb3Q9IjM1NDg3MjYwNjEiPjwvaW5zPgo8c2NyaXB0PgogICAgIChhZHNieWdvb2dsZSA9IHdpbmRvdy5hZHNieWdvb2dsZSB8fCBbXSkucHVzaCh7fSk7Cjwvc2NyaXB0Pg==