Izdelajte prilagojene odzivne vrstice napredka s programom ProgressBar.js
Vrstice napredka večino uporabnikov v spletu. Za razvijalce je pogosto zapleten postopek ustvarite vrstico napredka iz nič. Toda z ProgressBar.js Ni vam treba!
Ta brezplačna knjižnica odprte kode nima odvisnosti in podpira vse večje brskalnike, vključno z IE9+.
Privzeto lahko uporabite preprost bar, ali lahko izberite med nekaj osnovnimi oblikami, kot naprimer:
- Ena vrstica
- Polkrog
- Poln krog
- Trg
- Trikotnik
Lahko tudi oblikujete lastne oblike po meri kot so srce, oblak ali celo črka logotipa vašega spletnega mesta. To bo trajalo nekaj truda, vendar je končni rezultat lahko neverjeten.
Knjižnica deluje na poti SVG, Torej, če lahko zgraditi obliko lahko uporabite oznako SVG animirati s to knjižnico napredka.
Animacije lahko tudi vključi besedilo ali imajo vzorce start / stop po meri. Celoten API ima več podrobnosti z možnostmi / povratnimi klici ki jih lahko pregledate v svojem prostem času.
ProgressBar.js ima tudi majhno navodila za namestitev kjer lahko prenesite in nastavite skript z uporabo Bowerja, npm ali bolj poenostavljene strani GitHub.
In če narediš kaj kul, lahko pošljite kodo v repo GitHub. Ustvarjalec projekta Kimmo Brunfeldt ima odprite vprašanje GitHub kjer lahko predložite modele po meri v knjižnico.
Ti lahko dodajte animirane vrstice napredka prijavite strani, polja za nalaganje ali katero koli spletno stran kot pred nalagalnik. Možnosti so omejene samo z kako podrobno pripravljeni ste.
Na primer, všeč mi je demo za merjenje moči gesla služi pravemu namenu in koristi uporabniški izkušnji. Ta primer prihaja pakiran z vtičnikom, tako lahko to kopirate in spremenite po vaših željah.
Videti več primerov, Oglejte si domačo stran ProgressBar.js ali pokukajte na to geslo, ki prikazuje srčno animacijo.