Ho bisogno di indicatore di avanzamento circolare. Come dovrei implementarlo?Indicatore di avanzamento circolare con jQuery
Quello che sto cercando è ciò che l'interfaccia utente di jQuery ha nella loro pagina di pianificazione, ma non è ancora stata implementata. Sono curioso di sapere se qualcuno l'ha già implementato prima. Vedere l'articolo 6 nell'immagine seguente.
http://wiki.jqueryui.com/ProgressIndicator
Come, one of these? Non hai bisogno di un plugin per questo. Solo .show() e .hide() un GIF secondo necessità (o inseriscilo nel DOM, qualunque cosa faccia galleggiare la tua barca).
Che cosa stai caricando? Un esempio di base potrebbe essere:
Acclamazioni
L'href per '# load' dovrebbe essere'/path/to/animation.gif' e dovresti usare 'event.preventDefault()' in '$ ('# load'). Click (...)'. - In questo modo la pagina funziona in modo significativo se l'utente ha disabilitato JS. –
Quindi, dici che se l'utente fa clic sul link di caricamento e vede l'animazione (il vero .gif) se ha disabilitato JS, questo è significativo? javascript: void (0) sembra funzionare molto bene, anche negli esempi di API di YouTube ... Penso che sia meglio non fare nulla che portare a una gif animata. – Claudiu
Non jQuery, ma si potrebbe desiderare di dare un'occhiata al Raphaël libreria javascript, e in particolare, il polar clock example, e l'attributo personalizzato 'arco'. Ho usato Raphaël e jQuery insieme per generare alcune barre di avanzamento statiche circolari prima - funziona abbastanza bene.
Grazie a matt-austin Questa libreria sembra davvero interessante. Ho intenzione di provare a implementare un piccolo plug-in per creare un'animazione circolare temporizzata semplice con opzioni di base e un callback. Inserirò una risposta qui al progetto su GitHub se incontro il successo. –
È possibile utilizzare jQuery per far scorrere la posizione dello sfondo intorno e utilizzare o creare la tabella di immagine dello sprite css appropriata per esso.
ovviamente avresti bisogno di avere 100 celle sprite, e quindi avresti bisogno di compilare un elenco di coordinate di posizione in background in un array/tabella/dizionario multidimensionale.
progressMeterSpriteCoords = [
{x: 0, y: 0}, //0%
{x: -16, y: 0}, //1%
{x: -32, y: 0}, //2%
... etc etc..
{x: -320, y: -0}, //19%
{x: 0, y: -16}, //20%
{x: -16, y: -16}, //21%
{x: -32, y: -16}, //22%
... etc etc..
{x: -320, y: -16}, //29%
... etc etc..
{x: -320, y: -320} //99%
]
Spiacente mia domanda era forse troppo vago, ma quello che volevo dire era quello che jUqery squadra ui sta progettando: http://wiki.jqueryui.com/ProgressIndicator vedi 2 - Progettazione visiva sesto elemento. Quel tipo di progresso circolare che racconta quanti precenti sono stati completati. – newbie