Script jQuery jCarousel

• Aprilie 30, 2024

jQuery a făcut ca adăugarea de imagini pe site-uri să fie o sarcină ușoară. Există multe scripturi jQuery lansate sub licențele MIT și / sau GPL. Majoritatea acestora sunt scripturi plug-and-play (plug-in) care nu necesită cunoștințe de programare pe care să le utilizeze pe site-ul dvs. web sau să le instalați pe site-ul clientului. Este posibil să doriți să luați în considerare adăugarea de scripturi jQuery la serviciile de proiectare.

Un astfel de scenariu jQuery de Jan Sorgalla este jCarousel. Acest plug-in poate avea multe aplicații atât pentru grafică, cât și pentru text. Funcția principală a scriptului este de a derula conținut orizontal sau vertical. Conținutul poate fi static sau încărcat dinamic prin Ajax, JavaScript, PHP sau Flickr. Desigur, această a doua opțiune necesită familiarizare cu aceste limbi. jCarousel funcționează, de asemenea, cu Thickbox 3, astfel încât o imagine de dimensiuni mari să se deschidă în Thickbox când imaginea de miniatură este făcută clic pe carusel.

Cea mai mare parte a codului pentru script este trimisă în secțiunea Head a paginii web. Veți avea nevoie de biblioteca jQuery și de codul sursă jCarousel și fișierele cu foi de stil. Ce este plăcut în acest plug-in este că CSS poate fi „jupuit” pentru a avea multe aspecte. Conținutul care va fi defilat de script este plasat în corpul paginii web într-o listă UL de bază.

Aveți mai multe opțiuni pentru configurarea scriptului, inclusiv adăugarea animației personalizate și ușurarea. Poate funcționa cu butoane de derulare automată sau de navigare. O altă caracteristică plăcută este aceea că lățimea caruselului se redimensionează automat pentru a se potrivi cu fereastra browserului. Poate fi configurat pentru a afișa mai multe sau mai puține imagini în funcție de dimensiunea browserului sau poate fi configurat pentru a avea un număr setat de imagini cu spațiu flexibil între imagini, după cum este necesar. Puteți avea mai mult de un carusel pe o pagină și să oferiți fiecăruia o piele diferită.

Integrarea cu fluxul de fotografii Flickr și API Flickr este o caracteristică plăcută care nu se vede în majoritatea scripturilor. A fost testat să funcționeze în mai multe browsere, inclusiv în notoriul Internet Explorer 6.

S-ar putea să vă întrebați de ce ați utiliza asta în loc de o animație simplă gif pe care o puteți crea în Photoshop. Motivul principal este ușurința actualizării caruselului odată instalat. Este mai ușor să comutați conținut în lista UL decât să creați un nou gif de fiecare dată când trebuie să aveți un set diferit de imagini.

//sorgalla.com/projects/jcarousel/

Instrucțiuni Video,: How To Create An Image Slider In HTML, CSS & Javascript (Aprilie 2024).