fadeTo әдісі

fadeTo әдісі элементтің мөлдірлігін 0 мен 1 аралығындағы берілген мәнге біртіндеп өзгертеді.

Синтаксис

Ұзақтық пен мөлдірлік әдісті кез келген нұсқада қолданған кезде белгіленеді. Мөлдірліктің берілген уақыт ішінде өзгеруі, әдепкі бойынша 400мс:

.fadeTo(ұзақтық, мөлдірлік мәні);

Уақытты тек миллисекундпен емес, сонымен қатар slow (600мс) және fast (200мс) кілт сөздерімен де белгілеуге болады, мән неғұрлым үлкен болса, анимация соғұрлым баяу болады:

.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 әдісі,
элементтердің қасиеттерін анимациялайды