Metod fadeTo

Metod fadeTo elementning shaffofligini berilgan qiymatgacha, 0 dan 1 gacha bo'lgan diapazonda sekin o'zgartiradi.

Sintaksis

Davomiylik va shaffoflik metodning istalgan qo'llanish variantida belgilanadi. Shaffoflikning berilgan vaqt ichida o'zgarishi, andozasida 400ms:

.fadeTo(davomiylik, shaffoflik qiymati);

Vaqtni faqat millisekundlarda emas, balki kalit so'zlar bilan ham belgilash mumkin: slow (600ms) va fast (200ms), qiymat qancha katta bo'lsa, animatsiya shuncha sekinroq bo'ladi:

.fadeTo('slow' yoki 'fast', shaffoflik qiymati);

Shuningdek, uchinchi (ixtiyoriy) parametr sifatida callback-funksiyani uzatish mumkin - animatsiya tugagandan keyin ishga tushadi:

.fadeTo(davomiylik, shaffoflik qiymati, [callback-funksiya]);

Shuningdek, silliqlik funksiyasi va callback-funksiyani (ixtiyoriy parametrlar) uzatish mumkin - animatsiya tugagandan keyin ishga tushadi:

.fadeTo(davomiylik, shaffoflik qiymati, [silliqlik funksiyasi], [callback-funksiya]);

Misol

Quyidagi misolda, fadeTo metodi yordamida #hide tugmasi bosilganda #test elementi shaffoflik 0.5 gacha kamaytirilish orqali yashiriladi, #show tugmasida esa ko'rsatiladi:

<button id="hide">yashirish</button>
<button id="show">ko'rsatish</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);
});

Shuningdek qarang

metod fadeToggle,
bu elementlarning shaffofligini o'zgartiradi
metod fadeIn,
bu yashiringan elementlarni shaffofligini yo'q qilib, sekin ko'rsatadi
metod animate,
bu elementlar xususiyatlarini animatsiya qiladi