Методот slideToggle
Методот slideToggle мазно ги прикажува
скриените елементи и ги крие прикажаните.
Синтакса
Прикажување/скривање за зададено време,
400ms по основно:
.slideToggle(времетраење);
Времето може да се зададе не само во милисекунди,
туку и со клучни зборови slow (600ms)
и fast (200ms), колку е поголема вредноста,
толку е побавна анимацијата:
.slideToggle('slow' или 'fast');
Ако не се наведат параметри - нема да има анимација, елементите ќе се прикажуваат/скриваат моментално:
.slideToggle();
Може исто така како втор параметар да се пренесе функција за мазност, а како трет callback-функција - ќе се активира по извршувањето на анимацијата. Двата параметри се опционални:
.slideToggle(времетраење, [функција за мазност], [callback-функција]);
На методот може да му се пренесат различни опции, во вид на JavaScript објект, кој содржи парови клуч: вредност:
.slideToggle(опции);
Ваков објект може да пренесува следните
параметри и функции - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Опис
на овие параметри можете да ги погледнете за методот
animate. На пример,
да ја поставиме времетраењето и функцијата за мазност:
.slideToggle( {duration: 600, easing: easeInSine} );
Пример
Ајде по притискање на копчето, мазно да го скриеме
родителскиот div, кој содржи параграфи,
со помош на методот slideToggle (овој div
ќе го најдеме со помош на методот
parent),
по повторно притискање на копчето, div ќе
биде повторно мазно прикажан и т.н. Со пренесување на клучниот збор
slow, ќе ја поставиме брзината на 600ms:
<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');
});