Javascript-Spinning-Warte-Sanduhr-artiges Ding

Question

Ich möchte dem Benutzer einer Web-App mitteilen, dass eine Aufgabe mit langer Laufzeit ausgeführt wird.Früher wurde dem Benutzer dieses Konzept durch die Anzeige einer Sanduhr vermittelt.Heutzutage scheint es sich um einen animierten, sich drehenden Kreis zu handeln.(z. B. wenn Sie einen neuen Tab in Firefox laden oder in Mac OS X booten.Zufälligerweise sieht der überlaufende Stapel im Stackoverflow-Logo aus wie ein Viertel des Kreises.

Gibt es eine einfache Möglichkeit, diesen Effekt mit Javascript (insbesondere JQuery) zu erzeugen?Idealerweise hätte ich gerne einen dieser kleinen Spinner als Elemente in einer Tabelle, um dem Benutzer anzuzeigen, dass das System noch aktiv ist und eine ausstehende Aufgabe bearbeitet (d. h. nicht vergessen hat oder abgestürzt ist).(Natürlich ist mir klar, dass es möglich ist, dass das Back-End abgestürzt ist und das Front-End immer noch als animiertes, sich drehendes Ding angezeigt wird. Dies dient eher dem psychologischen Zweck, dass der Benutzer Aktivitäten sieht.)

Und wie nennt man dieses sich drehende Ding überhaupt?

Answer 1

Google Ajax-Aktivitätsanzeige um viele Bilder und Bildgeneratoren zu finden (das „sich drehende“ Bild selbst ist ein animiertes GIF).

Hier ist ein Link um Ihnen den Einstieg zu erleichtern.

Wenn Sie das Bild in der Hand haben, verwenden Sie JQuery, um die Sichtbarkeit des Bildes (oder möglicherweise seines übergeordneten DIV-Tags) umzuschalten.Sehen dieser Link für weitere Informationen.

rp

Answer 2

Diese Seite erledigt das für Sie:

ajaxload

und unter OS X heißt es „Beachball“ und ich füge gerne „Of Death“ hinzu.

Answer 3

http://preloaders.net/en/letters_numbers_words ist schön und hat viele Kategorien im linken Menü, die mehr bieten als http://ajaxload.info funktioniert, plus Optionen für Größe und Hintergrund ...Ajaxload sieht heutzutage ziemlich veraltet aus.

Answer 4

Ich gehe davon aus, dass Sie etwas gemeint haben, das auf Hintergrundaktivitäten während eines Ajax-Anrufs hinweist.

Ich neige dazu, eine CSS-Klasse zu haben, die das Hintergrundbild auf ein kleines animiertes GIF mit entsprechender Auffüllung und Positionierung festlegt (denken Sie daran, die Hintergrundwiederholung auszuschalten) und diese Klasse dann mit ein paar JavaScript-Helfern hinzuzufügen und zu entfernen, die beim Ajax aufgerufen werden Anruf gestartet wird und wann der Antwortrückruf ausgeführt wird.