Uz razne deformacije vani, mnogi za Mootools kao dobro, ja sam ipak odlučio napisati svoju carousel klase, za nekih dobrih razloga
1. Htio stranične značajku (da bi mogli skočiti određeni slajd / STEP u vrtuljak).
2. Htio sloboda s plasman na lijeve i desne tipke / Linkovi, gdje god mi se sviđa.
3. Više kontrole nad Slide koraka.
Sam uspio stvoriti novu Vrtuljak, s gore navedenim značajkama ... kao ispod ... Slobodno predložiti bilo kakve izmjene te će zahtijevati!
Moj primjer izgleda ovako ... [ View Demo ]
Pogledajte demo se | Preuzimanje Mootools Vrtuljak s stranične Version 1.0 (Downloaded 1975 puta)
1. Vrtuljak Paging
Možete jednostavno dodati stranične na vrtuljak, jednostavno postavljanjem stranične zastavu, koja je prošle parater prošlo dok stvara instancu MooCarousel na TRUE (želite stranične) ili false (donot žele stranične).
var carousel1 = new MooCarousel ('carousel1_wrapper', 'carousel1_items_container', 'carousel1_moveleft', 'carousel1_moveright', c_ns, c_sss, true); / / ns = broj slajdova, SSS = tobogan veličina koraka
I ofcourse možete promijeniti izgled-n-osjećati od tih stranične achors kao što molim mijenjanjem svoje CSS.
. Carousel_paging {text-align: right; margin: 5px 10px 0 0;}
. Carousel_paging struja, carousel_paging stranica {prikaz: none; širina:... 15px; visina: 15px; line-height: 15px; text-align: središte; display: block; plovak: lijevo, background: # D8D8EB, marža: 0 1px 0 0; text-decoration: none;}
. Carousel_paging: hover, carousel_paging struje {background: # 4D4D9B; color: # FFFFFF;}..
Dobro! postoji mali problem ipak, stranične sidra ako je skup, onda će se uvijek nastaje nakon carousel komponente. Htio sam da bude dinamičan kao dobro, ali onda samo da bi scenarij za puše iz proporcija, odlučio sam da ga preskočiti.
Ali znaš malo Javascript, možete jednostavno mijenjati kod generacije stranične u MooCarousel klase molimo vaše potrebe.
2. Prilagodba na lijevo i desno ikone
Možete promijeniti položaj, slike ili bilo displat imovine od lijeve i desne tipke jednostavno igranje okolo sa CSS-om. biti u mogućnosti mijenjati položaje u Lijevo i Desno buttoms je stvarni razlog za mene na desno moj naše carousel klase.
Budući da je ovo MooCarousel klasa, prihvaća id je od ovih gumba, zapravo možete staviti ove gumbe bilo gdje na stranici, molim Vas, ... ako to ne moraju biti u hijerarhiji elemenata, kao u mom primjeru.
var carousel1 = new MooCarousel ('carousel1_wrapper', 'carousel1_items_container', 'carousel1_moveleft', 'carousel1_moveright', c_ns, c_sss, true);
CSS
.. Carousel_container_l, carousel_container_r {margin: 50px 0 0 0; položaj: relativni, širina: 23px; visina: 20px; plovak: lijevo, pokazivač: pointer;}
. Carousel_container_r {background-position: 0-38px;}
. Carousel_container_l {background-position: 0-58px;}
3. Prilagodba Slide koraka
Što mi znači MOJE Prilagodba KORACIMA slajda?
Većina deformacije gurnite pun vidljivog prozora. Dakle, reći da je imao četiri stavke (kao u mom uzorku gore), to će slajd sve četiri stavke. S ovim carousel komponente, možete proći broj slajdova i korak veličine po vašem izboru.
var carousel1 = new MooCarousel ('carousel1_wrapper', 'carousel1_items_container', 'carousel1_moveleft', 'carousel1_moveright', c_ns, c_sss, true);
c_ns = broj slajdova, c_sss = tobogan veličina koraka
Također, u mom example1 sam calcuted veličinu klizni korak, temelji se na logici gdje je, znam broj predmeta, širinu na svaku stavku i marže koje su dane nakon svake stavke u mojoj CSS.
/ * Za bančenje 1 * /
var c1_w = 92 / / bančenje predmeta Širina
var c1_n = 10 / / Ukupan broj predmeta odnos prema bančenje
var c1_pp = 4 / / Broj odnos prema bančenje točke perpage
var c1_marginFactor = 51;
var c1_sss = c1_w * c1_pp / / SSS = tobogan veličina koraka
var c1_ns parseInt = (((c1_w * c1_n) / c1_sss) + 0,5); / / ns = broj slajdova
c1_sss + = c1_marginFactor / / SSS = tobogan veličina koraka, 51 na marginama
Zahtjevi: Mootools 1.2
Pogledajte demo se | Preuzimanje Mootools Vrtuljak s stranične Version 1.0 (Downloaded 1975 puta)
