Meetod fadeTo

Meetod fadeTo muudab sujuvalt läbipaistvust elementidel antud väärtusele, vahemikus 0 kuni 1.

Süntaks

Kestus ja läbipaistvus määratakse meetodi igas kasutusvariandis. Läbipaistvuse muutmine etteantud aja jooksul, vaikimisi 400ms:

.fadeTo(kestus, läbipaistvuse väärtus);

Aega saab määrata mitte ainult millisekundites, vaid ka võtmesõnadega slow (600ms) ja fast (200ms), mida suurem väärtus, seda aeglasem animatsioon:

.fadeTo('slow' või 'fast', läbipaistvuse väärtus);

Saab ka kolmanda (valikulise) parameetrina edastada callback-funktsiooni - käivitub pärast animatsiooni lõppu:

.fadeTo(kestus, läbipaistvuse väärtus, [callback-funktsioon]);

Saab edastada ka sujuvusfunktsiooni ja callback-funktsiooni (valikulised parameetrid) - käivitub pärast animatsiooni lõppu:

.fadeTo(kestus, läbipaistvuse väärtus, [sujuvusfunktsioon], [callback-funktsioon]);

Näide

Järgmises näites, meetodi fadeTo abil nupu #hide vajutamisel element #test peidetakse läbipaistvust vähendades väärtuseni 0.5, ja nupu #show vajutamisel - näidatakse:

<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);
});

Vaata ka

meetod fadeToggle,
mis muudab elementide läbipaistvust
meetod fadeIn,
mis sujuvalt näitab peidetud elemente, muutes need läbipaistmatuks
meetod animate,
mis animeerib elementide omadusi