جلوه‌ها - پنهان شدن و آشکار شدن

از ویکی‌کد
پرش به ناوبری پرش به جستجو
Main Page Tutorial
Jquery-menu.png
موارد آموزشی
۱خانه
۲مقدمه
۳شروع کار
۴دستور زبان
۵انتخابگرها (Selectors)
۶رویدادها
جلوه‌ها در jQuery
۱نمایش دادن / پنهان کردن
۲محو شدن
۳اسلاید
۴متحرک ساختن
۵stop()
۶فراخوانی (Callback)
۷زنجیره‌سازی (Chaining)
HTML در jQuery
۱Get
۲Set
۳اضافه‌کردن (Add)
۴حذف‌کردن
۵کلاس‌های CSS
۶css()
۷ابعاد
پیمودن در jQuery
۱پیمودن (Traversing)
۲اجداد
۳نسل‌ها
۴برادرها (Siblings)
۵فیلترکردن
AJAX در jQuery
۱مقدمهٔ AJAX
۲بارگذاری
۳Get/Post
متفرقه‌های jQuery
۱noConflict()
۲فیلترها
مثال‌ها
۱مثال‌ها
مرجع‌ها

Hide, Show, Toggle, Slide, Fade, and Animate. WOW![۱]

Click to show/hide panel

میانبر:
الگو:اتب

مثال‌ها

jQuery hide()

متد hide() ساده‌ای را در jQuery نشان می‌دهد.

jQuery hide()

نمایش دیگری از hide(). چگونه بخش‌هایی از متن را پنهان می‌کند.

hide() و show() در jQuery

بوسیله jQuery، می‌توانید عنصرهای HTML را با متدهای hide() و show() پنهان کنید یا نمایش دهید:

مثال
1 $("#hide").click(function(){
2   $("p").hide();
3 });
4 
5 $("#show").click(function(){
6   $("p").show();
7 });

نحو:

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

پارامتر اختیاری speed، سرعت پنهان/آشکار شدن را مشخص می‌کند و می‌تواند مقدارهای زیر را داشته باشد:”slow” (به فارسی: به آرامی)، “fast” (به فارسی: سریع) یا میلی ثانیه.

پارامتر اختیاری callback تابعی است که بعد از کامل شدن hide() یا show() اجرا می‌شود (در مورد تابع callback در بخش بعدی بیشتر خواهید آموخت).

مثال زیر پارامتر سرعت را با hide() نمایش می‌دهد:

مثال
1 $("button").click(function(){
2   $("p").hide(1000);
3 });

متد toggle() در jQuery

همچنین می‌توانید با متد toggle() بین نمایش دادن و پنهان کردن یک عنصر تغییر وضعیت دهید.

عنصرهای آشکار پنهان می‌شوند و عنصرهای پنهان شده آشکار می‌شوند:

مثال
1 $("button").click(function(){
2   $("p").toggle();
3 });

نحو:

$(selector).toggle(speed,callback);

پارامتر اختیاری speed می‌تواند مقدارهای زیر را داشته باشد: “slow”، “fast” یا میلی ثانیه.

پارامتر اختیاری callback تابعی است که باید بعد از کامل شدن toggle() اجرا شود.

تمرین‌های jQuery

مرجع جلوه‌های jQuery

برای مرور کامل همهٔ جلوه‌های jQuery، لطفاً به مرجع جلوه‌های jQuery مراجعه کنید.


منابع آموزشی