Metod slideToggle
Metod slideToggle yashiringan elementlarni muloyim ko‘rsatadi
va ko‘rsatilganlarni yashiradi.
Sintaksis
Ko‘rsatish/yashirish berilgan vaqt davomida,
400ms standart bo‘yicha:
.slideToggle(davomiylik);
Vaqtni faqat millisekundlarda emas,
balki kalit so‘zlar slow (600ms)
va fast (200ms) bilan ham belgilash mumkin, qiymat qancha katta bo‘lsa,
animatsiya shuncha sekinroq bo‘ladi:
.slideToggle('slow' yoki 'fast');
Agar parametrlarni ko‘rsatmasangiz - animatsiya bo‘lmaydi, elementlar darhol ko‘rsatiladi/yashiriladi:
.slideToggle();
Shuningdek, ikkinchi parametr sifatida silliqlik funksiyasini, hamda uchinchi parametr sifatida callback-funksiyani - animatsiya tugagandan so‘ng ishlaydi, uzatish mumkin. Ikkala parametr ham ixtiyoriy:
.slideToggle(davomiylik, [silliqlik funksiyasi], [callback-funksiya]);
Metodga turli xil opsiyalarni, JavaScript obyekti shaklida, o‘z ichiga olgan kalit: qiymat juftliklarini uzatish mumkin:
.slideToggle(options);
Bunday obyekt quyidagi parametrlar va funksiyalarni
uzatishi mumkin - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Ushbu
parametrlarning tavsifini siz metod uchun
animate da ko‘rishingiz mumkin. Masalan,
davomiylik va silliqlik funksiyasini o‘rnatamiz:
.slideToggle( {duration: 600, easing: easeInSine} );
Misol
Keling, tugmani bosgandan so‘ng, muloyim yashiramiz
ota div ni, u abzatslarni o‘z ichiga oladi,
slideToggle metodi yordamida (bu div ni
biz metod yordamida topamiz
parent),
tugmani qayta bosgandan so‘ng, div
qayta muloyim ko‘rsatiladi va h.k. Kalit so‘zni
slow uzatib, biz tezlikni 600ms ga o‘rnatamiz:
<button>toggle text</button>
<div>
<p id='test'>text text text text text text text</p>
<p>text text text text text text text</p>
<p>text text text text text text text</p>
</div>
$('button').click(function() {
$('#test').parent().slideToggle('slow');
});