Методот fadeTo

Методот fadeTo мазно ја менува провидноста на елементот до зададената вредност, во опсег од 0 до 1.

Синтакса

Времетраењето и провидноста се задаваат при кој било вариант на користење на методот. Промена на провидноста за зададено време, 400ms по стандард:

.fadeTo(времетраење, вредност на провидноста);

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

.fadeTo('slow' или 'fast', вредност на провидноста);

Може исто така како трет (незадолжителен) параметар да се пренесе callback-функција - ќе се активира по извршувањето на анимацијата:

.fadeTo(времетраење, вредност на провидноста, [callback-функција]);

Може исто така да се пренесе функција за замав и callback-функција (незадолжителни параметри) - ќе се активира по извршувањето на анимацијата:

.fadeTo(времетраење, вредност на провидноста, [функција за замав], [callback-функција]);

Пример

Во следниот пример, со помош на методот fadeTo при притискање на копчето #hide елементот со #test ќе се сокрива со намалување на провидноста до 0.5, а на #show - ќе се прикажува:

<button id="hide">hide</button>
<button id="show">show</button>
<div id="test"></div>

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

$('#show').on('click', function() {
	$('#test').fadeTo(1000, 1);
});

$('#hide').on('click', function() {
	$('#test').fadeTo(1000, 0.5);
});

Погледнете ги исто така

методот fadeToggle,
кој ја менува провидноста на елементите
методот fadeIn,
кој мазно ги прикажува скриените елементи, правејќи ги непровиди
методот animate,
кој ги анимира својствата на елементите