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,
որը անիմացնում է տարրերի հատկությունները