Testreszabott előrehaladási sávok létrehozása ProgressBar.js programmal
Haladási sávok az interneten a legtöbb felhasználó széles körben ismert. A fejlesztők számára ez gyakran bonyolult folyamat létrehoz egy előrehaladási sávot a semmiből. De ProgressBar.js nem kell!
Ez az ingyenes, nyílt forráskódú könyvtár nincs függősége és támogatja az összes fontosabb böngészőt, beleértve az IE9-et is+.
Alapértelmezés szerint használjon egy egyszerű sávot, vagy tudsz válasszon néhány alapformából, mint például:
- Egyvonalas
- Félkör
- Teljes kör
- Négyzet
- Háromszög
Ön is tervezhet saját egyéni formáid például egy szív, egy felhő, vagy akár a webhelye logójának felirata. Ez elnyerte némi erőfeszítést, de a végeredmény hihetetlen lehet.
A könyvtár működik SVG útvonalakon, így ha lehet építsen egy vázolt alakot az SVG jelölő használatával animálja ezzel a folyamatjelzős könyvtárral.
Az animációk is tartalmazzon szöveget vagy egyedi indítási / leállítási mintákkal rendelkeznek. A teljes API-nak van további részletek az opciókkal / visszahívásokkal hogy a szabadidődben megismerheted.
A ProgressBar.js-nak is van egy kicsi Telepítési útmutató ahol tudsz töltse le és állítsa be a parancsfájlt Bower, npm, vagy az egyszerűbb GitHub oldal használatával.
És ha valami hűvöset építesz, akkor tudod küldje el a kódját a GitHub repo-ba. A projekt alkotója, Kimmo Brunfeldt rendelkezik nyissa meg a GitHub problémát ahol tudsz egyedi mintákat kell benyújtania a könyvtárba.
tudsz animált előrehaladási sávok hozzáadása a feliratkozási oldalakhoz, feltöltési mezőkhöz vagy bármely weblaphoz, mint preloader. A beállításokat csak a korlátozza mennyire részletes hajlandó vagy.
Például szeretem a jelszóerősség mérő demóját valódi célt szolgál és a felhasználói élmény előnyei. Ez a példa jön a pluginnel együtt, így másolhatja ezt és módosíthatja azt tetszés szerint.
Látni további példák, nézd meg a ProgressBar.js kezdőlapját, vagy nézd meg ezt a hegedűt, amely bemutatja a szív animációt.
