Su įvairių karuselių ten, daugelis taip pat už MooTools, aš vis tiek nusprendė parašyti savo Karuselė klasės, gerų priežasčių
1. Norėjo ieškos funkciją galėtų šokti tam tikrą skaidrę / Step "karuselės").
2. Noriu laisvė su kairiojo ir dešiniojo mygtukų / Nuorodos apgyvendinimas, jei kada nors aš prašom.
3. Daugiau kontrolė per skaidrių žingsniai.
Man pavyko sukurti naują karuselė, su pirmiau nurodytų funkcijų, kaip nurodyta toliau ... Jauskitės laisvai siūlyti bet kokias pakeitimus galėtumėte reikia!!!
Mano pavyzdys atrodo ... [ Peržiūrėti Demo ]
Žiūrėti Demo | Parsisiųsti MooTools Karuselė Su ieškos versija 1.0 straipsnio Siuntėsi 1999 kartus)
1. Karuselė Puslapiuoti
Jūs galite lengvai pridėti ieškai savo karuselės, tiesiog ieškos vėliava, kuri yra naujausia išlaikė parater, kuriant true MooCarousel egzempliorių (noriu ieškos) arba false (donot nori ieškai).
var carousel1 =. naujas MooCarousel ("carousel1_wrapper", "carousel1_items_container", "carousel1_moveleft", "carousel1_moveright", c_ns, c_sss, tiesa); / / ns = skaidrės skaičius, SSS = skaidrių keitimo žingsnio dydis
Žinoma jūs galite pakeisti išvaizdą-n jausti šių ieškos achors, kaip galite pakeisti savo CSS.
Carousel_paging {text-align: teisė; margin: 5px 10px 0 0;}
Carousel_paging srovė, carousel_paging puslapis {outline: nėra; plotis:. 15px; aukštis: 15px; line-height: 15px; text-align: center; kalbomis: bloko; float: left; fonas: # D8D8EB; pelnas: 0 . 1px 0 0; text-decoration: none;}
Carousel_paging: hover, carousel_paging dabartinis {background: # 4D4D9B; spalva: # FFFFFF;}.
Gerai! yra maža problema, nors ieškos inkarai, jei nustatytas, tada jis bus generuojami visada po karuselės komponento. Aš norėjau, kad ji kintamą, taip pat, bet tada tiesiog laikyti Script užpučia proporcijų, aš nusprendžiau praleisti jį.
Bet jūs žinote, šiek tiek "Javascript", galite lengvai keisti ieškos kartos kodą į MooCarousel klasę prašome jūsų poreikius.
2. , Tinkinimas į kairę & Dešiniuoju piktogramos
Talpinimu, vaizdo ar, bet displat nuosavybę KAIRĖN ir DEŠINĖN mygtukus galite pakeisti tiesiog žaisti aplink su CSS. galėtų pakeisti kairiojo ir dešiniojo buttoms vietas buvo tikroji priežastis, kodėl mane dešinėje mano mūsų Karuselė klasės.
Nuo, tai MooCarousel klasė, pritaria id iš šių mygtukų, jūs iš tikrųjų galite įdėti šiuos mygtukus bet kurioje puslapio vietoje, jei galite ... ji neturi būti elementų hierarchijoje, kaip mano pavyzdyje.
var carousel1 =. naujas MooCarousel ("carousel1_wrapper", "carousel1_items_container", "carousel1_moveleft", "carousel1_moveright", c_ns, c_sss, tiesa);
CSS
Carousel_container_l, carousel_container_r {margin: 50px 0 0 0; pozicija: giminaitį; plotis: 23px; aukštis: 20px; float: left; žymeklis: rodyklė;}
Carousel_container_r {background-position: 0-38px;}
Carousel_container_l {background-position: 0-58px;}
3. Pritaikyti skaidrių padėtys
Ką reiškia MANO Pritaikyti skaidrių žingsniai?
Dauguma karuselės įstumkite visą matomo lango. Taigi pasakyti jums turėjo keturis elementus (pvz., mano mėginio aukščiau), ji bus skaidrę visus keturis elementus. Su šio Karuselė komponento, Jūs perduoti savo pasirinkimą skaidrių ir žingsnio dydis.
var carousel1 =. naujas MooCarousel ("carousel1_wrapper", "carousel1_items_container", "carousel1_moveleft", "carousel1_moveright", c_ns, c_sss, tiesa);
c_ns = skaidrių skaičius, c_sss = skaidrių keitimo žingsnio dydis
Be to, mano example1 aš calcuted skaidrių keitimo žingsnio dydis, remiantis logika jeigu aš žinau, elementų skaičių, kiekvieno elemento plotis ir paraštes, kurie po kiekvieno punkto mano CSS.
/ * 1 Bachanalia, * /
var c1_w = 92; / / Bachanalia punktas plotis
var c1_n = 10; / / Viso palyginimui Bachanalia Items
var c1_pp = 4 / / Numeris palyginimui Bachanalia elementai perpage
var c1_marginFactor = 51;
c1_sss var = c1_w * c1_pp; / / sss = skaidrių keitimo žingsnio dydis
var c1_ns = parseInt (((c1_w * c1_n) / c1_sss) + 0,5); / / ns = skaičius skaidres
c1_sss + = c1_marginFactor; / / sss = skaidrių keitimo žingsnio dydis, 51 maržos
Reikalavimai: MooTools 1.2
Žiūrėti Demo | Parsisiųsti MooTools Karuselė Su ieškos versija 1.0 straipsnio Siuntėsi 1999 kartus)
