Létrehozása diavetítés a honlapjára

A böngészője nem támogatja az iframe-technológiát. A navigáláshoz használja a felső menüben

Felülvizsgálata programok létrehozására diavetítések

Ehhez a plug-Diák. által létrehozott programozó Natanom Salesom (Nathan Searles), a technikai igazgató a design stúdió "Brigade" ( "The Brigade") Portland, Oregon, USA. Másrészt a fejlesztés a cikkben tárgyalt galériában egy online áruház.

Diák bővítmény - könnyen telepíthető, több lehetőséget változó képeket a diavetítés, és gyakran használják a fejléc az oldalon. Egy példa a munkájában csúszka alapértelmezett beállítások között az alábbiak szerint:

Beállítás indítása Diák

Mint mindig, először hozzon létre egy mappát szkriptek az oldalon. Akkor meg kell töltse le a fájlt, és csomagolja ki a létrehozott mappába. Ez ki fog derülni két script jquery-1.8.3.min.js és jquery.cycle.all.min.js.

Mint látható, van egy egyszerű szabály, és a CSS, amelyet meg kell adnia az ablak méretét, hogy a jövőben kép slideshow (szélesség - magasság). Természetesen, az összes kép kell az azonos méretű. Ha szükséges, akkor bontsa ki a CSS-beállítások hozzáadásával, például, határ, háttér, margók és egyéb elemek a diavetítés a képek. Ebben az esetben meg kell határozni, hogy a méret a teljes, azaz a kép plusz beállított margók és a határok hossza és szélessége.

Az utolsó lépés - képek elhelyezése az oldalon. Vannak is egyszerű. Ön helyezni a képet a tag

vagy a másik, amelynek megengedett beállítani a szélesség és a magasság, és adja meg a class = „diavetítés”. Példánkban a HTML-kódot, hogy a csúszka a következő:

A létrehozása diavetítés majdnem vége, és láthatjuk, hogy megnyitja az oldalt egy böngészőben.

Beállítása diavetítés beállítások Diák

Az időtartam kijelző képek által ellenőrzött paraméter timeout. és az arány - a kötési sebesség. Például idézek néhány gyakori diavetítés lehetőségeket és azok megfelelő szkripteket, hogy be kell illeszteni az oldal címét.

Néha szükség van, hogy több helyen lehetőséget diavetítések ugyanazon az oldalon a helyén, ahogy az ebben a cikkben. Ehhez egyszerűen jelzi a különböző osztályok az egyes opciók a sorban $ ( '. Slideshow). Cycle ((lásd a kódot a fenti táblázatban), és ne felejtsük el, hogy regisztrálják magukat a CSS ablak méretét az egyes osztályokra.

A böngészője nem támogatja az iframe-technológia

A böngészője nem támogatja az iframe-technológiát. A navigáláshoz használja a felső menüben