جلوه‌ها - محو شدن

از ویکی‌کد
پرش به ناوبری پرش به جستجو
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()
۲فیلترها
مثال‌ها
۱مثال‌ها
مرجع‌ها

بوسیله jQuery می‌توانید عنصرها را محو یا ظاهر کنید.[۱]

مثال‌ها

jQuery fadeIn()

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

jQuery fadeOut()

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

jQuery fadeToggle()

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

jQuery fadeTo()

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

متدهای محو کردن در jQuery

بوسیله jQuery می‌توانید عنصرها را محو و آشکار کنید.

jQuery برای محو کردن متدهای زیر را دارد:

  • fadeIn()
  • fadeOut()
  • fadeToggle()
  • fadeTo()

متد fadeIn() در jQuery

متد fadeIn() در jQuery برای آشکار کردن یک عنصر پنهان استفاده می‌شود.

نحو:

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

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

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

مثال زیر متد fadeIn() را با پارامترهای مختلف نمایش می‌دهد:

مثال
1 $("button").click(function(){
2   $("#div1").fadeIn();
3   $("#div2").fadeIn("slow");
4   $("#div3").fadeIn(3000);
5 });

متد fadeOut() در jQuery

متد fadeOut() در jQuery برای محو کردن یک عنصر قابل رویت استفاده می‌شود.

نحو:

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

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

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

مثال زیر متد fadeOut() را با پارامترهای مختلف نمایش می‌دهد:

مثال
1 $("button").click(function(){
2   $("#div1").fadeOut();
3   $("#div2").fadeOut("slow");
4   $("#div3").fadeOut(3000);
5 });

متد {fadeToggle() در jQuery

متد fadeToggle() در jQuery بین متدهای fadeIn() و fadeOut() تغییر وضعیت می‌دهد.

اگر عنصرها محو شده باشند، fadeToggle() آن‌ها را آشکار می‌کند.

اگر عنصرها آشکار باشند، fadeToggle() آن‌ها را محو می‌کند.

نحو:

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

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

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

مثال زیر متد fadeToggle() را با پارامترهای مختلف نمایش می‌دهد:

مثال
1 $("button").click(function(){
2   $("#div1").fadeToggle();
3   $("#div2").fadeToggle("slow");
4   $("#div3").fadeToggle(3000);
5 });

متد fadeTo() در jQuery

متد fadeTo() محو شدن را تا سطح خاصی از شفافیت انجام می‌دهد (مقدار بین ۰ و ۱)

نحو:

$(selector).fadeTo(speed,opacity,callback);

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

پارامتر لازم opacity در متد fadeTo() محو شدن تا میزان شفافیت داده شده را مشخص می‌کند (مقدار بین ۰ و ۱).

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

مثال زیر متد fadeTo() را با پارامترهای مختلف نمایش می‌دهد:

مثال
1 $("button").click(function(){
2   $("#div1").fadeTo("slow", 0.15);
3   $("#div2").fadeTo("slow", 0.4);
4   $("#div3").fadeTo("slow", 0.7);
5 });

تمرین‌های jQuery

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

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


منابع آموزشی