Creați bare personalizate cu ProgressBar.js
Bare de progres sunt cunoscute de majoritatea utilizatorilor de pe web. Pentru dezvoltatori, este adesea un proces complicat creați o bara de progres de la zero. Dar cu ProgressBar.js nu trebuie să!
Această bibliotecă open source gratuită nu are dependențe și acceptă toate browserele importante, inclusiv IE9+.
În mod implicit, poți utilizați o bară simplă, sau puteți selectați din câteva forme de bază, precum:
- O singura linie
- Semicerc
- Cerc complet
- Pătrat
- Triunghi
De asemenea, puteți proiecta propriile forme personalizate cum ar fi o inimă, un nor sau chiar inscripția siglei site-ului dvs. Acordat acest lucru va face un efort, dar rezultatul final poate fi incredibil.
Librăria funcționează pe căile SVG, așa că dacă poți construi o formă conturată folosind marcaje SVG puteți animați-o cu această bibliotecă de bara de progres.
Animațiile pot, de asemenea includeți text sau au modele personalizate de pornire / oprire. API-ul complet a avut mai multe detalii cu opțiuni / callbacks pe care le puteți vedea în timpul liber.
ProgressBar.js are, de asemenea, un mic ghid de instalare unde poti descărcați și configurați scriptul utilizând Bower, npm sau pagina GitHub mai simplificată.
Și dacă construiești ceva rece, poți trimiteți codul în repo GitHub. Creatorul proiectului, Kimmo Brunfeldt, are un deschideți problema GitHub unde poti trimiteți modele personalizate să fie incluse în bibliotecă.
Poti adăugați bare de progres animate la paginile de înscriere, la încărcarea câmpurilor sau la orice pagină web ca preloader. Opțiunile sunt limitate numai de cat de detaliat sunteți dispus să obțineți.
De exemplu, îmi place demo-ul de măsurare a intensității parolei de la acesta servește un scop real și beneficiază de experiența utilizatorului. Acest exemplu vine ambalate cu plugin-ul, astfel încât să puteți copia acest lucru și să îl modificați după preferințele dvs..
A vedea mai multe exemple, verificați pagina de pornire ProgressBar.js sau faceți o privire la această animație demoingând animația inimii.
