jQuery jCarousel Script

• Svibanj 8, 2024

jQuery je dodavanje slika na web stranice postao lak zadatak. Mnogo je jQuery skripti objavljenih pod MIT i / ili GPL licencama. Većina su to skripte plug-and-play (plug in-play) za koje nije potrebno znanje programiranja za upotrebu na vašoj web lokaciji ili instaliranje na web mjestu vašeg klijenta. Možda biste trebali razmotriti dodavanje jQuery skripti svojim dizajnerskim uslugama.

Jedan takav jQuery scenarij Jana Sorgalla je jCarousel. Ovaj dodatak može imati mnogo aplikacija i za grafiku i za tekst. Glavna funkcija skripte je pomicanje sadržaja vodoravno ili okomito. Sadržaj se može statički učitati ili dinamički učitavati putem Ajaxa, JavaScript-a, PHP-a ili Flickr-a. Naravno, ova druga opcija zahtijeva upoznavanje s ovim jezicima. jCarousel također radi s Thickboxom 3 tako da se slika velikog formata otvara u Thickbox kad se sličica klikne u vrtiću.

Na većinu koda skripte navodi se u odjeljku Head na web stranici. Trebat će vam biblioteka jQuery i izvorni kôd i datoteke tablice stilova jCarousel. Ono što je lijepo u ovom utikaču jest to što ga CSS može "skinuti" da ima mnogo izgleda. Sadržaj kojim se scenarij može kretati nalazi se u tijelu web stranice na osnovnom popisu UL.

Imate nekoliko opcija za konfiguriranje skripte, uključujući dodavanje prilagođene animacije i olakšavanje. Može funkcionirati pomoću gumba za automatsko pomicanje ili navigaciju. Sljedeća lijepa značajka je ta što se širina vrtišta automatski mijenja kako bi stao na prozor preglednika. Može se konfigurirati za prikaz više ili manje slika ovisno o veličini preglednika ili konfigurirati tako da ima postavljeni broj slika s fleksibilnim razmakom između slika po potrebi. Na stranici možete imati više karusela i svakom od njih dati drugačiju kožu.

Integracija s Flickr foto streamom i Flickr API-om je lijepa osobina koja se ne vidi u većini skripti. Testirano je da radi u nekoliko preglednika, uključujući zloglasni Internet Explorer 6.

Možda se pitate zašto biste to koristili umjesto jednostavne gif animacije koju možete stvoriti u Photoshopu. Glavni razlog je jednostavnost ažuriranja vrtilja nakon instaliranja. Lakše je prebaciti sadržaj na popisu UL nego stvoriti novi gif svaki put kada trebate prikazati drugačiji skup slika.

//sorgalla.com/projects/jcarousel/

Upute Video: jQuery Tutorial #6 - Building a jQuery Image Slider (Svibanj 2024).