محو کردن عناصر در jQuery

چاپ

با jQuery می توان عناصر را کم کم ناپدید و یا نمایان کرد.

مثال

مثال - خودتان امتحان کنید

()fadeIn
این مثال، چگونگی نمایان کردن عناصر را نشان می دهد.

()fadeOut
این مثال، چگونگی محو کردن عناصر را نشان می دهد.

()fadeToggle
این مثال، چگونگی محو یا نمایان کردن عناصر را نشان می دهد.

()fadeTo
این مثال، چگونگی محو کردن کردن عناصر تا یک مقدار مشخص را نشان می دهد.

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

با jQuery می توان یک عنصر را محو و یا نمایان کرد.

متدهایی که برای این منظور در jQuery استفاده می شود:

متد ()fadeIn

متد ()fadeIn، یک عنصر پنهان را با سرعتی مشخص نمایان می کند.

نحوه استفاده:

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

پارامترها:

پارامتر توضیح
 speed

اختیاری است، سرعت شفاف شدن را مشخص می کند و می تواند با مقادیر "slow"، "fast" و یا میلی ثانیه مقدار دهی شود.
callback

اختیاری است، تابعی است که بعد از اجرای کامل متد ()fadeIn اجرا می شود. (درباره تابع callback در مطالب بعدی بیشتر توضیح داده خواهد شد)

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

مثال (محو کردن عناصر در jQuery)

$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});
خودتان امتحان کنید »

متد ()fadeOut

متد ()fadeOut، یک عنصر را با سرعتی مشخص محو می کند.

نحوه استفاده:

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

پارامترها:

پارامتر توضیح
 speed

اختیاری است، سرعت محو شدن را مشخص می کند و می تواند با مقادیر "slow"، "fast" و یا میلی ثانیه مقدار دهی شود.
callback

اختیاری است، تابعی است که بعد از اجرای کامل متد ()fadeOut اجرا می شود.

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

مثال (محو کردن عناصر در jQuery)

$("button").click(function(){
  $("#div1").fadeOut();
  $("#div2").fadeOut("slow");
  $("#div3").fadeOut(3000);
});
خودتان امتحان کنید »

متد ()fadeToggle

متد ()fadeToggle، بین متدهای ()fadeIn و ()fadeOut حرکت می کند.

عناصر شفاف را محو و عناصر پنهان را شفاف می کند.

نحوه استفاده:

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

پارامترها:

پارامتر توضیح
 speed

اختیاری است، سرعت محو یا نمایان شدن را مشخص می کند و می تواند با مقادیر "slow"، "fast" و یا میلی ثانیه مقدار دهی شود.
callback

اختیاری است، تابعی است که بعد از اجرای کامل متد ()fadeIn یا ()fadeOut اجرا می شود.

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

مثال (محو کردن عناصر در jQuery)

$("button").click(function(){
  $("#div1").fadeToggle();
  $("#div2").fadeToggle("slow");
  $("#div3").fadeToggle(3000);
});
خودتان امتحان کنید »

متد ()fadeTo

متد ()fadeTo، یک عنصر را تا یک مقدار مشخص، محو می کند. (مقداری بین 0 و 1)

نحوه استفاده:

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

پارامترها:

پارامتر توضیح
 speed

الزامی است، سرعت محو شدن را مشخص می کند و می تواند با مقادیر "slow"، "fast" و یا میلی ثانیه مقدار دهی شود.
opacity

الزامی است، میزان شفافیت را مشخص می کند و عددی بین 0 و ا است.
callback

اختیاری است، تابعی است که بعد از اجرای کامل متد ()fadeTo اجرا می شود.

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

مثال (محو کردن عناصر در jQuery)

$("button").click(function(){
  $("#div1").fadeTo("slow",0.15);
  $("#div2").fadeTo("slow",0.4);
  $("#div3").fadeTo("slow",0.7);
});
خودتان امتحان کنید »

jQuery Effects Reference

For a complete overview of all jQuery effects, please go to our jQuery Effect Reference.

نوشته شده توسط امیر پهلوان صادق
بازدید: 20923