टॉगल विधि

toggle विधि तत्वों के कोमल प्रदर्शन/छिपाने को बारी-बारी से करती है। यदि तत्व दिखाया गया है, तो उसे छिपा दिया जाएगा और इसके विपरीत।

वाक्य - विन्यास

मिलीसेकंड में दिए गए समय के लिए प्रदर्शन, डिफ़ॉल्ट रूप से 400ms:

.toggle(अवधि);

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

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

display पैरामीटर के साथ मान true या false पास किया जा सकता है। यदि true है, तो तत्व केवल दिखाया जाएगा, false - छिपाया जाएगा:

.toggle(display);

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

.toggle();

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

.toggle(अवधि, [स्वरूपण फ़ंक्शन], [कॉलबैक फ़ंक्शन]);

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

.toggle(अवधि, [कॉलबैक फ़ंक्शन]);

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

.toggle(विकल्प);

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

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

उदाहरण

आइए बटन दबाने के बाद, छिपी हुई पैराग्राफ को कोमलता से दिखाएं toggle विधि की सहायता से। कीवर्ड slow पास करके, हम गति 600ms पर सेट करेंगे। दोबारा दबाने पर - छिपाएंगे:

<button>पाठ दिखाएं</button>
<p style="display: none">पाठ</p>

$('button').click(function() {
	$('p').toggle('slow');
});

यह भी देखें

विधि fadeToggle,
जो तत्वों की पारदर्शिता बदलती है
विधि slideToggle,
जो तत्वों के कोमल प्रदर्शन/छिपाने को बारी-बारी से करती है
विधि show,
जो तत्वों को कोमलता से दिखाती है
विधि hide,
जो तत्वों को कोमलता से छिपाती है