fadeTo मेथड

fadeTo मेथड पारदर्शिता को 0 से 1 की रेंज में, दिए गए मान तक स्मूदली बदलता है।

सिन्टैक्स

मेथड के किसी भी वेरिएंट का इस्तेमाल करते समय अवधि और पारदर्शिता सेट की जाती है। दिए गए समय में पारदर्शिता बदलना, डिफॉल्ट रूप से 400ms:

.fadeTo(अवधि, पारदर्शिता मान);

समय न केवल मिलीसेकंड में, बल्कि कीवर्ड slow (600ms) और fast (200ms) से भी सेट किया जा सकता है। मान जितना अधिक होगा, एनिमेशन उतना ही धीमा होगा:

.fadeTo('slow' या 'fast', पारदर्शिता मान);

एक कॉलबैक फंक्शन - जो एनिमेशन पूरा होने के बाद एक्जीक्यूट होगा - को तीसरे (वैकल्पिक) पैरामीटर के रूप में भी पास किया जा सकता है:

.fadeTo(अवधि, पारदर्शिता मान, [कॉलबैक-फंक्शन]);

ईजिंग फंक्शन और कॉलबैक-फंक्शन (वैकल्पिक पैरामीटर्स) भी पास किए जा सकते हैं - यह एनिमेशन पूरा होने के बाद एक्जीक्यूट होगा:

.fadeTo(अवधि, पारदर्शिता मान, [ईजिंग फंक्शन], [कॉलबैक-फंक्शन]);

उदाहरण

निम्नलिखित उदाहरण में, #hide बटन दबाने पर fadeTo मेथड की मदद से #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 मेथड,
जो एलिमेंट्स के प्रॉपर्टीज को एनिमेट करता है