Метод fadeToggle

Метод fadeToggle наизменично глатко приказује или сакрива елементе, анимирајући њихову провидност.

Синтакса

Приказивање/сакривање у задатом времену, 400ms подразумевано:

.fadeToggle(трајање);

Време се може задати не само у милисекундама, већ и кључним речима slow (600ms) и fast (200ms), што је већа вредност, то је спорија анимација:

.fadeToggle('slow' или 'fast');

Ако се параметри не наведу - анимације неће бити, елементи ће се приказивати/сакривати тренутно:

.fadeToggle();

Такође се може другим параметром проследити функција убрзања, и трећим callback-функција - која ће се извршити након завршетка анимације. Оба параметра нису обавезна:

.fadeToggle(трајање, [функција убрзања], [callback-функција]);

Методу се могу проследити различите опције, у облику JavaScript објекта, који садржи парове кључ: вредност:

.fadeToggle(options);

Такав објекат може проследити следеће параметре и функције - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Опис ових параметара можете погледати за метод animate. На пример, поставимо трајање и функцију убрзања:

.fadeToggle( {duration: 800, easing: easeInSine} );

Пример

У следећем примеру при првом притиску на дугме #toggle елемент са #test ће се сакривати, а при поновном - приказивати. За то користимо метод fadeToggle. Такође поставићемо брзину на 1000ms и вредност функције убрзања на linear:

<button id="toggle">toggle</button>
<div id="test"></div>

#test {
	width: 200px;
	height: 200px;
	background: green;
	color: white;
	margin-top: 10px;
}

$('#toggle').on('click', function() {
	$('#test').fadeToggle(1000, 'linear');
});

Види још

метод slideToggle,
који наизменично глатко приказује/сакрива елементе
метод fadeTo,
који мења провидност елемената
метод toggle,
који наизменично приказује/сакрива елементе
метод animate,
који анимира својства елемената