افکت Fade در jQuery
یادگیری jQueryدر jQuery می توانید یک عنصر را محو کرده و قابلیت مشاهده آن را کم و زیاد کنید.
متد های fading در jQuery
jQuery شامل متد های fade زیر است:
- ()fadeIn
- ()fadeOut
- ()fadeToggle
- ()fadeTo
متد ()fadeIn
متد ()fadeIn برای ظاهر شدن تدریجی عناصر مخفی به کار می رود.
شکل دستوری:
پارامتر سرعت اختیاری بوده و مدت زمان افکت را مشخص می کند. مقادیر زیر را می تواند قبول کند:
• slow
• fast
• مدت زمان به milliseconds
پارامتر اختیاری callback ، تابعی است که پس از پایان اجرای تابع fade اجرا خواهد شد.
مثال زیر روش کار متد ()fadeIn را با پارامترهای مختلف نشان می دهد:
مثال :
$("button").click(function(){
$("#div1").fadeIn();
$("#div2").fadeIn("slow");
$("#div3").fadeIn(3000);
});
مشاهده مثال
متد fadeOut()
متد ()fadeOut برای کاهش قابلیت مشاهده عناصر به کار می رود. به عبارتی دیگر ، عنصر را به تدریج محو می کند و عنصر نهایتا مخفی می شود.
شکل دستوری:
پارامتر سرعت اختیاری بوده و مدت زمان افکت را مشخص می کند. این پارامتر مقادیر زیر را می تواند قبول کند:
• slow
• fast
• مدت زمان به milliseconds
پارامتر اختیاری callback تابعی است که پس از پایان اجرای تابع fade اجرا خواهد شد.
مثال زیر روش کار متد ()fadeout را با پارامترهای مختلف نشان می دهد:
$("button").click(function(){
$("#div1").fadeOut();
$("#div2").fadeOut("slow");
$("#div3").fadeOut(3000);
});
مشاهده مثال
متد fadeToggle
متد fadeToggle بین دو متد ()fadeIn و ()fadeout سوییچ ایجاد می کند.
اگر روی عناصر افکت fade out انجام شده باشد، پس متد ()fadeToggle آن عناصر را fade in خواهد کرد.
اگر روی عناصر افکت fade In انجام شده باشد، پس متد ()fadeToggle آن عناصر را fade out خواهد کرد.
شکل دستوری :
پارامتر سرعت اختیاری بوده و مدت زمان افکت را مشخص می کند. این پارامتر مقادیر زیر را می تواند قبول کند:
• slow
• fast
• مدت زمان به milliseconds
پارامتر اختیاری callback تابعی است که پس از پایان اجرای تابع fade اجرا خواهد شد.
مثال زیر روش کار متد ()fadeToggle را با پارامترهای مختلف نشان می دهد:
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle(3000);
});
مشاهده مثال
متد ()fadeto
متد ()fadeto این امکان را می دهد هنگام اعمال fading ، شفافیت عنصر را نیز تغییر دهید( مقداری بین 0 و 1).
شکل دستوری:
پارامتر سرعت الزامی است و مدت زمان این افکت را معین می کند. مقادیر زیر را می تواند قبول کند:
• slow
• fast
• مدت زمان به milliseconds
پارامتر شفافیت (opacity) در متد ()fadeto الزامی است و میزان شفافیت عنصر را با مقداری بین 0 و 1 تعیین می کند.
پارامتر اختیاری callback تابعی را مشخص می کند که بعد از اجرای کامل این متد، اجرا خواهد شد.
مثال زیر متد ()fadeTo را با پارامترهای مختلف نشان می دهد:
$("button").click(function(){
$("#div1").fadeTo("slow", 0.15);
$("#div2").fadeTo("slow", 0.4);
$("#div3").fadeTo("slow", 0.7);
});
مشاهده مثال
نظر شما
>