Lade-Animation "Spinner" im Tab anstatt Sanduhr-Symbol

Guck mal in diesen Thread, vielleicht hilft er Dir:

Beitrag

Loading-Spinner im Tab ändern?

Hallo!

Frage an die Firefox-Experten:
Mir sind die zwei winzigen Pünktchen, die sich im neuesten Firefox als Loading-Spinner oben im Tab einer gerade ladenden Seite drehen, zu klein für meine Augenqualität. Den alten hatte ich auch aus dem Augenwinkel immer besser im Blick und musste nicht unbedingt ausdrücklich hinstarren.

Hat jemand ne Ahnung, ob man da nachträglich einen anderen Spinner bzw. wieder den alten hinbekommen kann?
Danke!

firecamper099

22. November 2017 um 22:35

Zitat von Thunderstruck

Hat jemande eine Idee wie ich den wieder bekomme?

Teste bitte:

/*der Schatten von links nach rechts über den Tab bei Reload weg*/
.tab-loading-burst {
  opacity: 0 !important;
}

/*der schwarze Punkt im Throbber weg beim Reload*/
.tab-throbber-fallback[busy]::before,
.tab-throbber[busy]::before,
.tab-throbber[progress]::before {
  opacity: 0 !important;
}

.tab-throbber[busy] {
  background-image: url("chrome://global/skin/icons/loading.svg")!important;
  background-repeat: no-repeat !important;
  margin-top: 0px !important;
  -moz-context-properties: fill !important;
  fill: #0070ff !important;
  background-size: 18px !important;
}

Die Farbe kannst/musst du dir anpassen in Zeile 18.

Zitat von Thunderstruck

eine schöne Lade-Animation zum Beispiel den "Spinner"

Aris-t2 hat fünf Optionen, hier ist eine von ihnen Sie müssen dieses Css und zwei Bilder herunterladen, tabthrobber_fx56_connecting.png und tabthrobber_loading-ubuntu.png.

Hallo,

Zitat von Thunderstruck

ich möchte anstatt der statischen Sanduhr

Das scheinen irgendwie alle überlesen zu haben. Dass du die Sanduhr siehst, bedeutet, dass du in deinem System die Option zur Reduzierung von Animationen aktiviert hast. Die musst du abstellen.

Zitat von Thunderstruck

ich möchte anstatt der statischen Sanduhr in den Tabs eine schöne Lade-Animation zum Beispiel den "Spinner"

Ganz hübsch finde ich einen Ladebalben in der Kopfzeile des Tab.

/* Visuelle Anzeige des Seitenladezustands in der Kopfzeile der Tabs*/
/* progress-bar page loading in the tab header */
.tabbrowser-tab:not([usercontextid]) > .tab-stack > .tab-background > .tab-context-line {
   opacity: 0;
   background-color: #2A970A;
   height: 3px;	
}

.tabbrowser-tab:is([busy], [progress]) > .tab-stack > .tab-background > .tab-context-line {
   opacity: 1;
   transform-origin: left center;
   animation: 2s ease-in-out scale;
}

.tabbrowser-tab[bursting] > .tab-stack > .tab-background > .tab-context-line {
   transition: opacity 2s ease-out;
}

@keyframes scale {
   0% {transform: scaleX(0);}
   100% {transform: scaleX(1);}
}

Farbe anpassen in Zeile 5.

Oh, freut micht sehr, dass ich auch mal was helfen konnte. Aber mit fremden Lorbeeren schmücke ich mich nicht. Der Code ist natürlich nicht von mir, ich kann das garnicht. Habe ich irgendwo auf dieser Seite kopiert.

Zitat von Thunderstruck

die für mich unerwünschten Animationen von Windows aus geschaltet lassen

Die Einstellung, auf die du dich beziehst, betrifft nicht nur Windows, sondern sämtliche Anwendungen auf deinem System, welche diese Einstellung berücksichtigen. Das schließt auch Firefox ein - und zwar für weit mehr als nur diese eine Animation.

Zitat von Sören Hentzschel

Hallo,

Zitat von Thunderstruck

ich möchte anstatt der statischen Sanduhr

Das scheinen irgendwie alle überlesen zu haben. Dass du die Sanduhr siehst, bedeutet, dass du in deinem System die Option zur Reduzierung von Animationen aktiviert hast. Die musst du abstellen.

Das ist oder war zumindest mal auch eine Fx spezifische Konfiguration, die man in about:config umstellen konnte, via prefersReducedMotion - und die Sanduhr kam dann mit eben diesen reduzierten Animationen.