Ustvarite barvni material za napredek materiala z lahkoto z Mprogress.js
Ni mogoče zanikati, da je Google oblikovanje materiala je korenito spremenila splet. Ponuja: a skupni jezik oblikovanja ki jih oblikovalci uporabniškega vmesnika lahko uporabljajo za vsa spletna mesta in mobilne aplikacije.
Ta trend oblikovanja materiala je privedel do številnih knjižnic, vključno s priljubljenim okvirom Materialise. In eden od kul nove materialne projekte Našel sem Mprogress.js.
Ta knjižnica JavaScript ustvarja a vrstica napredka materiala z uporabo čistih CSS in JavaScript. Ni odvisnosti, brez neumnosti. Preprosto nalaganje (in vnaprejšnje nalaganje) z zasnovo materiala, ki se bo ujemala z vsako spletno stranjo ali spletno aplikacijo.
Nastavitev je precej preprosta in zahteva samo dve datoteki: CSS in JS skript iz Mprogressa.
Ti lahko prenesite oboje od repo ali GitHub uporabite upravitelja paketov kot je npm ali Bower. Od tam morate ustvarite nov objekt Mprogressa in mu povej, naj zažene nalagalnik.
To je mogoče storiti z dobesedno eno vrstico kode:
var mprogress = novo Mprogress ('start');
Druge lastnosti lahko uporabite za spreminjanje časa animacije, hitrosti ali barve prikaza vrstice napredka. Ta konfiguracija vam celo omogoča ustvarite predloge po meri temelji na privzetem slogu oblikovanja materiala. Super!
Pokukajte na demo stran za prikaz tega nalagalnika v akciji. To ni mesmerizing nakladanje bar, vendar pa ponuja lepo rešitev, ne da bi morali zgraditi eno iz nič.
Lahko izvajate podobne metode nastavi ()
do nastavite odstotek ali inc ()
do povečajte nakladalno vrstico. Z njim je mogoče programsko obdelati, da ustvarite nalagalnik HTTP, vendar v JavaScriptu ni potrebno dodatno delo.
Lepota Mprogress.js je zaradi svoje preprostosti. Ne pove vam, kako strukturirati podatke ali kaj morate naložiti. Lahko se nalaganje strani, ali pa se lahko obdeluje nalaganje datoteke. Ali pa je lahko sledenje, kako daleč navzdol je uporabnik pomaknil z vrha strani.
S knjižnico in z njo lahko storite toliko nič odvisnosti lahko ga uporabite za kateri koli spletni projekt. Če želite začeti, preverite MProgress repo na GitHubu, kjer lahko brskate tudi po dokumentacijo.