Javascript che gira aspetta una cosa tipo clessidra

Question

Vorrei indicare all'utente di un'app Web che è in corso l'esecuzione di un'attività di lunga durata.Un tempo questo concetto veniva comunicato all'utente visualizzando una clessidra.Al giorno d'oggi, sembra essere un cerchio rotante animato.(ad esempio, quando carichi una nuova scheda in Firefox o esegui l'avvio in Mac OS X.Per coincidenza, lo stack traboccante nel logo StackOverflow assomiglia a un quarto del cerchio).

Esiste un modo semplice per creare questo effetto utilizzando Javascript (in particolare JQuery)?Idealmente, mi piacerebbe avere uno di questi piccoli spinner come elementi in una tabella, per indicare all'utente che il sistema è ancora attivo nell'elaborazione di un'attività in sospeso (ovvero, non si è dimenticato o non si è bloccato).(Ovviamente, mi rendo conto che è possibile che il back-end si sia bloccato e il front-end venga ancora visualizzato come un oggetto che gira in animazione, è più per lo scopo psicologico dell'utente che vede l'attività).

E comunque, come si chiama quella cosa che gira?

Answer 1

Google Indicatore di attività Ajax per trovare molte immagini e generatori di immagini (l'immagine "rotante" stessa è una GIF animata).

Qui è un collegamento per iniziare.

Con l'immagine in mano, usa JQuery per attivare/disattivare la visibilità dell'immagine (o forse del suo tag DIV principale).Vedere questo link per qualche informazione in più.

p.p

Answer 2

questo sito farà al caso tuo:

ajaxload

e su OS X si chiama "Beachball" e mi piace aggiungere "Of Death".

Answer 3

http://preloaders.net/en/letters_numbers_words è carino e ha molte categorie nel menu a sinistra che offrono più di http://ajaxload.info fa, oltre a opzioni di dimensione e sfondo...ajaxload sembra piuttosto obsoleto in questi giorni.

Answer 4

Presumo che tu intendessi qualcosa per indicare attività in background durante una chiamata Ajax.

Tendo ad avere una classe CSS che imposta l'immagine di sfondo su una piccola GIF animata, con riempimento e posizionamento appropriati (ricordati di disattivare la ripetizione dello sfondo), quindi aggiungi e rimuovi quella classe utilizzando un paio di helper JavaScript chiamati quando Ajax viene avviata la chiamata e quando viene eseguita la richiamata della risposta.