Kuidas laiendada pisipilte nagu Google'i pildid
Google Images kasutab ainulaadset kasutajaliidest koos pisipiltide eelvaated paljudest erinevatest veebisaitidest. Nende pisipiltide klõpsamine laiendab ekraani üksikasjade ja suurema pildiga.
See on üks parimaid pildigalerii funktsioone, mida ma olen kasutanud ja nüüd, saate kloonida selle Gridder.js'iga.
See tasuta jQuery plugin järgib Google'i uskumatu UX-i jälgi, luues sellele efektile vastava plugina. Sa saad lülitage ükskõik milline fotogalerii Google'i kujutiste stiilis galeriisse kõigi samade animatsioonide ja kuvamisfunktsioonidega.
Mul on meeldivalt üllatunud selle pluginaga kaasas olev kiirus ja kasutusmugavus. Lihtsalt klõpsates pisipilti kuvab kohe suurema pildi ja animatsioonid on super puhtad.
Pildid lisada kirjeldava teksti osa kui soovite lisada mõned pildiga seotud üksikasjad või lingid. See toimib eriti lihtsate portfellide puhul, mille eesmärk on keskenduda piltidele.
Selle peale võite tõmmake sisu ka läbi Ajaxi. See võimaldab teil luua dünaamilisi pisipilte mis tõmbavad sisu teistelt veebisaitidelt või API-de kaudu.
Iga kliki sündmus pakub tagasihelistamismeetodit, nii saate ka Gridderi kõrval kasutada ka teisi pluginaid või JavaScript-funktsioone. Nii paljude valikuvõimalustega tundub, et see on peaaegu kogu võrgu raamistik!
Kuna Gridder töötab jQuery'l, see nõuab sõltuvust uuimast versioonist. Aga see on kõik, mida vajate (koos failiga Gridder.js) ning mõne HTML-reaga saate oma võrku sujuvalt kasutada.
Peaksite läbi vaatama GitHubi lehe täielik seadistusjuhend kuid siin on a kiire eelvaade milline HTML välja näeb:
Kogu sisu läheb läbi JavaScript, et saaksite laadida midagi, mida sa tahad.
See on uskumatult mitmekülgne lisandmoodul muutke animatsiooni kiirust, leevendage, sulgege nuppude stiili ja liigutage nihke asendit kui kasutaja klõpsab uut pisipilti.
Algaja ja pro arendajad leiavad selles pluginas palju väärtust. Siiski, kui sa pole veel kindel, kas see on teie jaoks, vaadake live Gridderi demo-lehekülge ja mängige ringi.
