Metod fadeTo

Metod fadeTo geçirijiligi elementiň berlen bahasyna çenli ýumşak üýtgedýär, 0-dan 1 çenli aralykda.

Sintaksis

Dowamlylygy we geçirijilik metodyň islendik ulanylyş wariantynda berilýär. Geçirijiligiň berlen wagtyň dowamynda üýtgemegi, adaty boýunça 400ms:

.fadeTo(dowamlylyk, geçirijilik bahasy);

Wagty diňe millisekuntlarda däl, eýsem açar sözler bilen hem berlip bolýar slow (600ms) we fast (200ms), baha uly bolsa, animasiýa haýal:

.fadeTo('slow' ýa-da 'fast', geçirijilik bahasy);

Üçünji (mecburi däl) parametr hökmünde hem callback-funksiýasyny geçirmek bolýar - animasiýany ýerine ýetirenden soň işleýär:

.fadeTo(dowamlylyk, geçirijilik bahasy, [callback-funksiýasy]);

Ýumşaklyk funksiýasyny we callback-funksiýasyny hem (mecburi däl parametrler) geçirmek bolýar - animasiýany ýerine ýetirenden soň işleýär:

.fadeTo(dowamlylyk, geçirijilik bahasy, [ýumşaklyk funksiýasy], [callback-funksiýasy]);

Mysal

Aşakdaky mysalda, fadeTo metodynyň kömegi bilen düwmä #hide basylanda #test bilen element geçirijiligi 0.5-ä çenli azaldylmak bilen gizleniler, #show düwmesine basylanda bolsa görkeziler:

<button id="hide">gizle</button>
<button id="show">görkez</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);
});

Şeýle-de görüň

metod fadeToggle,
elementleriň geçirijiligini üýtgedýär
metod fadeIn,
gizlenen elementleri ýumşak görkezýär, olary geçiriksiz edýär
metod animate,
elementleriň aýratynlyklaryny animasiýalaýar