Cum să extindeți miniaturile ca Google Imagini
Imaginile Google rulează un interfață utilizator unic cu miniaturi de la multe site-uri diferite. Dacă faceți clic pe oricare dintre aceste miniaturi, ecranul va fi extins cu mai multe detalii și cu o imagine mai mare.
Este una dintre cele mai bune caracteristici ale galerii de imagini pe care le-am folosit și acum, îl puteți clona cu Gridder.js.
Acest plugin jQuery gratuit urmează pe urmele incredibilei UX de la Google, creând un plugin care se potrivește cu acest efect. Poti transformați orice galerie foto într-o galerie de stil Google Imagini cu toate aceleași animații și caracteristici de afișare.
Sunt plăcut surprins de viteza și ușurința de utilizare a acestui plugin. Doar făcând clic pe orice miniatură afișează imediat o fotografie mai mare iar animațiile sunt foarte curate.
Imaginile include o secțiune pentru textul descriptiv în cazul în care doriți să adăugați câteva detalii sau link-uri referitoare la poze. Acest lucru funcționează foarte bine pentru site-uri simple de portofoliu, cu scopul de a se concentra asupra imaginilor.
În plus, poți de asemenea, trageți conținut prin Ajax. Acest lucru vă permite creați miniaturi dinamice care atrage conținut de pe alte site-uri web sau prin intermediul API-urilor.
Fiecare eveniment de clic oferă o metodă de apel invers, astfel încât să puteți rula chiar și alte pluginuri sau funcții JavaScript alături de Gridder. Cu atât de multe opțiuni, se simte practic ca un cadru întreg de rețea!
De la Gridder rulează pe jQuery, aceasta necesită cea mai nouă versiune ca dependență. Dar, asta e tot ce aveți nevoie (împreună cu fișierul Gridder.js), și cu câteva linii de HTML, puteți avea grilă să ruleze fără probleme.
Ar trebui să verificați pagina GitHub pentru instrucțiuni complete de configurare dar aici e a previzualizare rapidă din ceea ce arată HTML:
Tot conținutul este tras prin JavaScript, astfel încât să puteți încărca aproape orice doriți.
Este un plugin incredibil de versatil, cu opțiuni pentru schimbați viteza de animație, relaxați, închideți stilul butonului și derulați poziția offset pentru că utilizatorul face clic pe o nouă miniatură.
Noii dezvoltatori și dezvoltatorii pro vor găsi o mulțime de valoare în acest plugin. Cu toate acestea, dacă încă nu sunteți sigur dacă acest lucru este pentru dvs., aruncați o privire la pagina de demo live Gridder și jucați în jur.
