Looge BaguetteBox.js'iga vastuslik ja ilus täislehekülg

Seal on kümneid lightboxi pluginaid ja nad kõik on suurepärased erinevatel põhjustel. Mõned töötavad portfelli saitidel paremini, samas kui teised on kõige paremini reageerivad.

Kuid üks minu lemmik uutest pluginatest on baguetteBox.js, loodud JavaScript-arendaja Marek Grzybek.

Loomulikult on see plugin täiesti vabalt kasutatav ja GitHubist avatud, kui soovite koodiga kaevata.

Raamatukogu ei ole mingeid sõltuvusi, nii et saate seda käivitada ilma jQuery, Zepto või midagi muud. See on puhas JavaScript-raamatukogu, millel on tõesti lihtne seadistamine.

See on mõeldud töötavad ideaalselt mobiilseadmetes, nii et see suudab toetada swipes ja kraanid, samuti vaikimisi käitumist lauaarvutites ja sülearvutites. See on üks vähestest täisekraani galeriidest toetama mobiilsidevahelist suhtlust koos täieliku modaalse efektiga.

Kontrollige demo leht näha, et see toimib. Sellel on täisfunktsionaalne galerii koos üks kood, mis on vajalik selle töötamiseks:

 baguetteBox.run ('. baguetteBoxOne'); 

Nii, see sihtib konteineri elementi klassiga .baguetteBoxOne ja kogu galerii töötab sellest välja.

Sa võiksid seadistage kohandatud suvandid kui soovite asju, mis on näiteks pealdised, nuppude stiilid, eelsalvestusfunktsioonid ja tagasihelistamismeetodid onclick / onchange sündmuste jaoks. Kõik need valikud on hästi dokumenteeritud GitHubis kui sa tahad sukelduda.

Aga see ei võta palju, et see ületaks konteineri elementi ja mõned põhilised pildielemendid.

Sina omama täielikku kontrolli animatsioonide, kujutise suuruste, pühkimisefektide ja galerii sisu, näiteks pealkirjade / pealdiste üle. See ei vaja JavaScripti, nii et sellel ei ole modaalile puhtat CSS-alternatiivi. Aga kuna enamik brausereid toetab JavaScripti, ei tohiks see olla probleem.

Lisateabe saamiseks külastage baguetteBox.js'i põhilehekülge ja saate oma mõtteid jagada ka Twitter @feimosi loojaga.