Izradite prilagođene prilagodljive trake napretka s programom ProgressBar.js
Trake napretka široko su poznati većini korisnika na webu. Za programere često je to kompliciran proces stvorite traku napretka od nule. Ali s ProgressBar.js ne morate!
Ova besplatna knjižnica otvorenog koda nema ovisnosti i podržava sve glavne preglednike, uključujući IE9+.
Prema zadanim postavkama možete koristite jednostavan bar, ili možete odaberite od nekoliko osnovnih oblika, kao što su:
- Jedna linija
- Polukrug
- Puni krug
- Kvadrat
- Trokut
Također možete dizajnirati vlastite prilagođene oblike kao što su srce, oblak ili čak i slova logotipa vaše web-lokacije. To će potrajati, ali krajnji rezultat može biti nevjerojatan.
Knjižnica radi na SVG putovima, pa ako možete izgraditi obrise pomoću SVG oznake možete animirati ga s ovom bibliotekom trake napretka.
Animacije također mogu uključi tekst ili imaju prilagođene uzorke za pokretanje / zaustavljanje. Cijeli API ima više detalja s opcijama / povratnim pozivima koje možete pročitati u svoje slobodno vrijeme.
ProgressBar.js također ima mali Vodič za instalaciju gdje možeš preuzmite i postavite skriptu koristeći Bower, npm ili pojednostavljenu GitHub stranicu.
A ako napravite nešto cool možete pošaljite svoj kôd u GitHub repo. Tvorac projekta, Kimmo Brunfeldt ima otvoriti GitHub izdanje gdje možeš pošalji prilagođene dizajne biti uključeni u knjižnicu.
Možeš dodajte animirane trake napretka prijaviti stranice, učitati polja ili na bilo koju web-stranicu kao preloader. Opcije su samo ograničene koliko detaljno spremni ste dobiti.
Na primjer, volim demo mjerač jačine lozinke služi pravoj svrsi i koristi korisniku. Ovaj primjer dolazi pakiran s dodatkom, tako da ga možete kopirati i izmijeniti po želji.
Vidjeti više primjera, provjerite početnu stranicu ProgressBar.js ili zavirite u ovu gusku demo prikazujući animaciju srca.
