jQuery jCarousel Script

• Smět 13, 2024

jQuery učinil přidání obrázků na webové stránky snadným úkolem. Na základě licencí MIT a / nebo GPL existuje mnoho skriptů jQuery. Většina z nich jsou plug-and-play (plug-in) skripty, které nevyžadují žádné znalosti programování pro použití na vašem webu nebo instalaci na webu vašeho klienta. Možná budete chtít zvážit přidání skriptů jQuery do svých návrhářských služeb.

Jedním takovým skriptem jQuery Jana Sorgally je jCarousel. Tento plug-in může mít mnoho aplikací pro grafiku i text. Hlavní funkcí skriptu je posouvat obsah vodorovně nebo svisle. Obsah může být statický nebo dynamicky načtený pomocí Ajaxu, JavaScriptu, PHP nebo Flickru. Tato druhá možnost samozřejmě vyžaduje znalost těchto jazyků. jCarousel také pracuje s Thickboxem 3, takže po kliknutí na miniaturu v karuselu se do Thickboxu otevře velký obrázek.

Na většinu kódu skriptu se odkazuje v části Hlavy na webové stránce. Budete potřebovat knihovnu jQuery a soubory zdrojového kódu jCarousel a soubory stylů. Co je hezké na tomto plug-inu je, že to může být "kůže" CSS mít mnoho vzhledů. Obsah, který má skript skrýt, je umístěn v těle webové stránky v základním seznamu UL.

Máte několik možností pro konfiguraci skriptu, včetně přidání vlastní animace a uvolnění. Může fungovat s tlačítky automatického rolování nebo navigace. Další příjemnou vlastností je, že se šířka karuselu automaticky přizpůsobí velikosti okna prohlížeče. Může být nakonfigurován tak, aby zobrazoval více či méně obrázků v závislosti na velikosti prohlížeče, nebo může mít nastavený počet obrázků s flexibilním rozestupem mezi obrázky podle potřeby. Na stránce můžete mít více než jeden karusel a dát každému z nich jiný vzhled.

Integrace s fotografickým proudem Flickr a rozhraním Flickr API je příjemná funkce, kterou ve většině skriptů nevidíte. Bylo testováno, aby fungovalo v několika prohlížečích, včetně notoricky známého prohlížeče Internet Explorer 6.

Možná se ptáte, proč byste to místo jednoduché animace gif, kterou můžete vytvořit ve Photoshopu, použili. Hlavním důvodem je snadná aktualizace karuselu po jeho instalaci. Je jednodušší přepínat obsah v seznamu UL než vytvořit nový gif pokaždé, když potřebujete mít jinou sadu obrázků.

//sorgalla.com/projects/jcarousel/

Video Návody: jQuery Tutorial #6 - Building a jQuery Image Slider (Smět 2024).