Početna » UI / UX » Kako proširiti sličice poput Googleovih slika

    Kako proširiti sličice poput Googleovih slika

    Google Slike prikazuju jedinstveni korisnički interfejs minijature iz raznih web-mjesta. Klikom na bilo koju od tih sličica proširuje se zaslon s više pojedinosti i većom slikom.

    To je jedna od najboljih značajki galerije slika koju sam koristio i sada, možete ga klonirati s Gridder.js.

    Ovaj besplatni jQuery plugin slijedi stope Googleovog nevjerojatnog UX-a stvarajući dodatak koji odgovara tom učinku. Možeš bilo koju fotogaleriju pretvorite u galeriju u stilu Google slika sa svim istim animacijama i značajkama prikaza.

    Ugodno sam iznenađen brzinom i jednostavnošću korištenja koja dolazi s ovim dodatkom. Samo kliknite bilo koju sličicu odmah prikazuje veći snimak i animacije su super čiste.

    Slike uključuju odjeljak za opisni tekst u slučaju da želite dodati neke detalje ili linkove vezane uz slike. To posebno dobro funkcionira za jednostavne web stranice portfelja s ciljem fokusiranja na slike.

    Povrh toga, možete također povucite sadržaj putem Ajaxa. To vam omogućuje stvoriti dinamične minijature koji povlače sadržaj s drugih web-lokacija ili putem API-ja.

    Svaki događaj klikom nudi metodu povratnog poziva, tako da uz Gridder možete pokrenuti i druge dodatke ili JavaScript funkcije. S tako mnogo opcija, praktički se osjeća kao cijeli okvir mreže!

    Od Griddera radi na jQuery, zahtijeva najnoviju verziju kao ovisnost. Ali, to je sve što vam je potrebno (zajedno s Gridder.js datotekom), i uz nekoliko redaka HTML-a, možete omogućiti glatko funkcioniranje mreže.

    Trebali biste provjeriti GitHub stranicu za pune upute za postavljanje ali ovdje je a brzi pregled kako izgleda HTML:

      
    Sadržaj dolazi ovdje ...

    Sav sadržaj dobiva povučen kroz JavaScript, tako da možete učitati gotovo sve što želite.

    To je nevjerojatno svestran dodatak s opcijama promijenite brzinu animacije, ublažite, zatvorite stil gumba i pomaknite položaj pomaka kada korisnik klikne na novu sličicu.

    Newbie i pro programeri podjednako će naći puno vrijednosti u ovom dodatku. Ipak, ako još uvijek niste sigurni je li to za vas, pogledajte demo stranicu Griddera uživo i zaigrajte se.