نمایش اسلایدی

نمایش اسلایدی

با jQuery می توان عناصر را بصورت اسلایدی یا کشویی مخفی و یا نمایان کرد.

پنهان و نمایان کردن عناصر بصورت اسلایدی در jQuery

با jQuery می توان عناصر را بصورت اسلایدی مخفی و یا نمایان کرد.

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

  • ()slideDown
  • ()slideUp
  • ()slideToggle


متد ()slideDown

متد ()slideDown، یک عنصر پنهان را به صورت اسلایدی نمایان می کند.

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

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

پارامترها:

پارامتر توضیح
 speed اختیاری است، سرعت نمایش اسلاید را مشخص می کند و می تواند با مقادیر “slow”، “fast” و یا میلی ثانیه مقدار دهی شود.
callback اختیاری است، تابعی است که بعد از اجرای کامل متد ()slideDown اجرا می شود. (درباره تابع callback در مطالب بعدی بیشتر توضیح داده خواهد شد)

مثال زیر، نحوه ی استفاده از متد ()slideDown را نشان می دهد:

مثال

$(“#flip”).click(function(){
$(“#panel”).slideDown();
});

متد ()slideUp

متد ()slideUp، یک عنصر را به صورت اسلایدی پنهان می کند.

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

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

پارامترها:

پارامتر توضیح
speed اختیاری است، سرعت پنهان شدن به صورت اسلایدی را مشخص می کند و می تواند با مقادیر “slow”، “fast” و یا میلی ثانیه مقدار دهی شود.
callback اختیاری است، تابعی است که بعد از اجرای کامل متد ()slideUp اجرا می شود.

مثال زیر، نحوه ی استفاده از متد ()slideUp را نشان می دهد:

مثال

$(“#flip”).click(function(){
$(“#panel”).slideUp();
});

متد ()slideToggle

متد ()slideToggle، بین متدهای ()slideDown و ()slideUp حرکت می کند.

عنصر پنهان را بصورت اسلایدی نمایان و یا عنصر نمایان را بصورت اسلایدی پنهان می کند.

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

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

پارامترها:

پارامتر توضیح
speed اختیاری است، سرعت پنهان و یا نمایان شدن به صورت اسلایدی را مشخص می کند و می تواند با مقادیر “slow”، “fast” و یا میلی ثانیه مقدار دهی شود.
callback اختیاری است، تابعی است که بعد از اجرای کامل متد ()slideUp اجرا می شود.

مثال زیر، نحوه ی استفاده از متد ()slideToggle را نشان می دهد:

مثال

$(“#flip”).click(function(){
$(“#panel”).slideToggle();
});

اگه به اشتراک نزاشتی حداقل لایک کن:(

نظر شما در رابطه با این آموزش چیست


بالا

تمامی حقوق مادی و معنوی این وبسایت محفوظ میباشد و متعلق است به Webtekar.ir.
Google