Lory Carousel Slider Funkcije CSS Animation & Touch Support

Od vseh vrtiljak plugins online Moram napeti klobuk Lory. Tako je preprost koncept vendar je preprosto eden od najmočnejših drsnikov na spletu.

The omejena različica skupaj je približno 7KB, kar ni majhno, ampak zagotovo ni slab za drsnik z vrtljivim gumbom na dotik.

Ta dodatek lahko dodate na katero koli spletno mesto od takrat deluje na jQuery ali navadni vanilji JS. Lahko teče z brez odvisnosti kar je super za združljivost.

Lory je tudi eden redkih vtičnikov v starejših brskalnikih ne degradira. To je v celoti podprta v IE10+, in starejše različice lahko še vedno poganjajo drsnik brez animacij in malo dodatkov.

Moraš naredite vse programsko kodiranje sami če želite dodati vsebino, vendar je presenetljivo preprosta. Določite lahko velikost vsake plošče, koliko časa želite animirati in kako ravnati z odzivnimi brskalniki.

Oglejte si domačo stran Lory za izvorno kodo in podrobnosti o namestitvi.

Začnite z dodajanjem knjižnice Lory JS v vaše spletno mesto glavo oddelek, bodisi kot vtičnik jQuery ali knjižnico vanilije. Trenutno so vse različice gostila na CDN Cloudflare, zato je zelo enostavno vključiti kopijo brez prenosov.

Z nameščeno datoteko JavaScript boste želeli ustvariti neurejen seznam HTML z vsebino diapozitivov, vendar Lory prihaja z nekaj vnaprej določenimi razredi zato je dobro držite se svojega modela.

Tukaj je nekaj vzorčna koda iz glavnega repozitorija Lory GitHub:

 
 
 
 
1
 
2
 
3
 
4
 
5
 
6
 
 
 

Zdaj v jQuery (ali navaden JS), lahko nastavite klic funkcije. Izgledati mora nekako takole:

 $ ('. js_slider'). lory (neskončno: 1); 

Zapomnite si neskončno možnost je le ena od številnih funkcij, ki jih lahko prilagodite. In vedno lahko spremenite .js_slider razred, ki ustreza vašim potrebam.

Med razvojem s tem vtičnikom boste verjetno imeli na voljo veliko vprašanj za prilagajanje. Zelo priporočam brskanje po dokumentaciji ki je na dnu strani GitHub.

Verjetno ni najboljša lokacija za dokumentarce, ampak na srečo so precej majhna. Samo imate približno 10 možnosti prilagoditi in morda 10-12 različnih dogodkov z njimi lahko klečete. Te informacije lahko najdete tudi na dnu spletne strani Lory, vendar je veliko lažje brati na GitHubu.

Posodobitve niso tako pogoste, vendar lahko vedno zahtevka za izdajo v GitHubu, če naletite na težave. Če imate res težave s kodo, jih boste najbrž lažje reševali pri pretakanju skladov.

Kakorkoli, lahko hitro začnite z uporabo CDN Cloudflare in dokumentov GitHub. In če iščete a demo v živo s kodo Oglejte si ta vnos CodePen.