slideUp मेथड

slideUp मेथड एलिमेंट्स को नीचे से ऊपर की ओर सरकाते हुए धीरे-धीरे छिपाता है। एलिमेंट्स को दिखाने के लिए slideDown मेथड का उपयोग किया जा सकता है।

सिंटैक्स

निर्धारित समय में छिपाना, डिफ़ॉल्ट रूप से 400ms:

.slideUp(duration);

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

.slideUp('slow' या 'fast');

यदि कोई पैरामीटर निर्दिष्ट नहीं किया जाता - कोई एनीमेशन नहीं होगा, एलिमेंट्स तुरंत छिप जाएंगे:

.slideUp();

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

.slideUp(duration, [easing function], [callback function]);

मेथड को विभिन्न विकल्प, जावास्क्रिप्ट ऑब्जेक्ट के रूप में पास किए जा सकते हैं, जिसमें key: value जोड़े होते हैं:

.slideUp(options);

ऐसा ऑब्जेक्ट निम्नलिखित पैरामीटर और फ़ंक्शन पास कर सकता है - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always। इन पैरामीटर्स का विवरण आप animate मेथड के लिए देख सकते हैं। उदाहरण के लिए, अवधि और ईज़िंग फ़ंक्शन सेट करते हैं:

.slideUp( {duration: 800, easing: easeInSine} );

उदाहरण

आइए बटन दबाने के बाद, इनपुट और बटन वाले पैरेंट div को slideUp मेथड की सहायता से धीरे-धीरे छिपाएं (यह div हम parent मेथड की सहायता से ढूंढेंगे)। कीवर्ड slow पास करके, हम गति 600ms पर सेट करेंगे। #test वाले div में हम 'Text is hidden' लिखेंगे:

<div>
	<button>टेक्स्ट छिपाएं</button>
	<input type="text" value="aaa">
</div>
<div id="test"></div>

$('button').click(function() {
	$(this).parent().slideUp('slow', function() {
		$('#test').text('Text is hidden');
	});
});

यह भी देखें

slideDown मेथड,
जो एलिमेंट्स को धीरे-धीरे दिखाता है
slideToggle मेथड,
जो एलिमेंट्स को धीरे-धीरे दिखाने/छिपाने को टॉगल करता है
fadeOut मेथड,
जो एलिमेंट्स को पारदर्शी बनाकर धीरे-धीरे छिपाता है
hide मेथड,
जो एलिमेंट्स को धीरे-धीरे छिपाता है