hide মেথড
hide মেথডটি এলিমেন্টগুলোকে মসৃণভাবে লুকিয়ে দেয়। এলিমেন্টগুলোকে
আবার দেখানো যায়
show মেথড ব্যবহার করে।
সিনট্যাক্স
নির্দিষ্ট সময়ে অদৃশ্য হওয়া,
ডিফল্টভাবে 400ms:
.hide(সময়কাল);
সময় শুধুমাত্র মিলিসেকেন্ডেই নয়,
slow (600ms)
এবং fast (200ms) কীওয়ার্ড দিয়েও নির্দিষ্ট করা যায়, মান যত বেশি হয়,
অ্যানিমেশন তত ধীর গতির হয়:
.hide('slow' বা 'fast');
যদি কোন প্যারামিটার উল্লেখ না করা হয় - কোন অ্যানিমেশন হবে না, এলিমেন্টগুলো তাৎক্ষণিকভাবে লুকিয়ে যাবে:
.hide();
দ্বিতীয় প্যারামিটার হিসেবে ইজিং ফাংশন পাস করা যায়, এবং তৃতীয় প্যারামিটার হিসেবে একটি callback ফাংশন পাস করা যায় - যা অ্যানিমেশন সম্পন্ন হওয়ার পরে কার্যকর হবে। উভয় প্যারামিটারই ঐচ্ছিক:
.hide(সময়কাল, [ইজিং ফাংশন], [callback ফাংশন]);
মেথডে বিভিন্ন অপশন পাস করা যায়, জাভাস্ক্রিপ্ট অবজেক্ট আকারে, যাতে key: value জোড়া থাকে:
.hide(options);
এই ধরনের একটি অবজেক্ট নিম্নলিখিত
প্যারামিটার এবং ফাংশন পাস করতে পারে - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always। এই
প্যারামিটারগুলোর বর্ণনা আপনি
animate মেথডের জন্য দেখতে পারেন। উদাহরণস্বরূপ,
সময়কাল এবং ইজিং ফাংশন সেট করা যাক:
.hide( {duration: 800, easing: easeInSine} );
উদাহরণ
চলুন #test বাটনে ক্লিক করার পরে, মসৃণভাবে
প্যারাগ্রাফটি hide মেথড ব্যবহার করে লুকিয়ে দেই।
slow কীওয়ার্ড পাস করে, আমরা গতি
600ms এ সেট করব। অ্যানিমেশন শেষ হওয়ার পরে কনসোলে
'Animation complete' প্রিন্ট করব:
<button id="test">টেক্সট লুকান</button>
<p>টেক্সট</p>
$('#test').click(function() {
$('p').hide('slow', function() {
console.log('Animation complete')
});
});
