Crearea unui slide show pentru site-ul dvs.

Browser-ul dvs. nu acceptă tehnologia iframe. Pentru a naviga, utilizați meniul de sus

Revizuirea programelor pentru crearea de slide show

Pentru aceasta vom folosi plug-Slide-uri. creat de programator Natanom Salesom (Nathan Searles), directorul tehnic al studioului de design "Brigada" ( "Brigada") din Portland, Oregon, Statele Unite ale Americii. Pe de altă parte dezvoltarea sa discutat în galeria de articol pentru un magazin online.

Slide-uri plugin - ușor de instalat, are mai multe opțiuni pentru modificarea imaginilor în expunerea de diapozitive, și este adesea folosit pentru antetul site-ului. Un exemplu al activității acestui cursor cu setările implicite este prezentată mai jos:

Setarea Slide-uri prezentarea

Ca întotdeauna, creați mai întâi un script dosar de pe site-ul. Apoi, aveți nevoie pentru a descărca fișierul și dezarhivați-l într-un folder creat. Se va dovedi două scripturi jquery-1.8.3.min.js și jquery.cycle.all.min.js.

După cum puteți vedea, există o regulă simplă și CSS, pe care trebuie să specificați dimensiunea ferestrei în viitor prezentarea imaginii (lățime - înălțime). Bineînțeles, toate imaginile trebuie să aibă aceeași dimensiune. Dacă se dorește, puteți extinde CSS setările prin adăugarea, de exemplu, de frontieră, fundal, margini, și alte elemente pentru un slide show de imagini. În acest caz, este necesar să se precizeze mărimea totală, adică, imaginea plus setați margini și frontiere în lungime și lățime.

Ultimul pas - plasarea de imagini pe pagină. Există, de asemenea, simplu. Plasați imaginea în eticheta

sau de altă parte, pentru care este permis să se stabilească lățimea și înălțimea, și specificați clasa lui = „slideshow“. De exemplu, codul HTML pe al cursorului este după cum urmează:

La crearea unui slide show este aproape de peste, și îl puteți vedea deschizând pagina într-un browser.

Setarea opțiunilor de diapozitive Slide-uri

Durata de imagini de afișare este controlat de parametrul timeout. iar rata - viteza de setare. De exemplu, am cita câteva opțiuni comune și slideshow-uri script-uri lor corespunzătoare, care ar trebui să fie inserate în titlul paginii.

Uneori trebuie să plasați mai multe opțiuni de diapozitive pe aceeași pagină a site-ului, așa cum se face în acest articol. Pentru a face acest lucru, pur și simplu indică diferitele clase pentru fiecare opțiune în linia $ ( „Prezentare“). Ciclul ((a se vedea codul din tabelul de mai sus), și nu uitați să se înregistreze în dimensiunea ferestrei CSS pentru fiecare clasă.

Browser-ul dvs. nu acceptă tehnologia iframe

Browser-ul dvs. nu acceptă tehnologia iframe. Pentru a naviga, utilizați meniul de sus