Programozható csúszkája jquery - Area Web Developer

Ahhoz, hogy helyesen működjön, meg kell példát jQuery könyvtár és három képe fájlnevek pic1.jpg, pic2.jpg, pic3.jpg mérete 200x200 képpont.

A minta kód két fájlt: slider.html és slider.js. A slider.html fájl megadott HTML-jelölés egység egy csúszkát tartalmaz képeket és csúszka görgetés gombokat. A slider.js fájl leírását tartalmazza, hogy mi történik, ha megnyomja a „bal” és „jobb”.

1. File slider.html

A fájl elején megadott stílusokat. A jelentését a legtöbb stílusok - eltávolított különböző margókat az elemek, mint amikor görgetés csúszka alkalmazott aritmetikai számítások segítségével a szélessége a tárgyakat, és fontos, hogy az elemek nem eltérések szélessége a megadott kézzel, különben előfordulhat Görgetéskor kiszámíthatatlan ofszet és egyéb hibákat.

A szerkezet maga a csúszka predstvlyayu 3 beágyazott objektum: lenta, cont és csúszkát.

Object lenta opredeleyaet látható területének csúszka, a példában korlátozzák 660 px széles (ez éppen elég 3 kép 200x200 px a francia bekezdés).

Cont objektum határozza meg a tartalmát a csúszka, hogy szabadon elmozdulhat az objektumon belülre lenta vízszintesen, ami egy vizuális hatás a görgetés.

Object csúszka tartalmaz egy táblázatot a képek azt mutatják, a csúszkát. Ebben a példában nincs tábla nem tudja, különben a kép kezd sorakoznak nemcsak vízszintesen, hanem függőlegesen, ami ellentmond az ötlet egy csúszka.

Amellett, hogy a csúszka a jelölésben megadott left_btn kulcsok ( „bal”) és right_btn ( „jó”), hogy lépjünk a csúszkát a megfelelő irányba.

Az eseménykezelő gombok alatt slider.js fájlban.

2. Fájl slider.js

beállításokat használja elején slider.js file:
on_screen_pic - képek száma látható részének a csúszka;
slider_diff - offset px, amelyre görgetése ennek megnyomása révén a csúszka gomb (szükségszerűen összegével egyenlő a kép szélességét és padding);

A fájl használható slider.js elemi számtani. Algoritmus a munka minden gomb a következő:
1. Határozza meg, hogy még ma is mozgassa a csúszkát az irányba nem támaszkodva a széle;
2. Ha lehet, majd mozgassa a csúszkát, vagy ha a helyzet nem változott.

Szeretné kiegészíteni az anyagot? - Írjon nekünk: [email protected]