وب مستران گرامی حالتون که خوبه؟ امیدوارم که این چنین باشه و سلامت و شاد باشید . در ادامه به اموزش متدها خواهیم پرداخت.این بخش در مورد متد toggleClass() بحث خواهد کرد که یک گروه مفید جدید برای ترمیم می باشد. متد toggleClass() یک یا چند گروه از هر عنصر را در مجموعه ی هماهنگ شده ی عناصر اضافه یا حذف می کند.
ترکیب:
متد toggleClass() دارای ترکیب پایه ی خود به شکل زیر می باشد:
افزوده شده به ورژن ۱٫۰ از jQueryUI
toggleClass( className [, switch ] [, duration ] [, easing ] [, complete ] )
Parameter
Description
className
این پارامتر یک String است که نام CCS گروه یا لیست space-delimited از نام های گروه را نشان می دهد که باید اضافه شده، حذف شده و یا troggle شوند.
switch
از نوع Boolean می باشد و اگر تعیین شده باشد، متد toggleClass() را وادار می کند تا در صورت تنظیم بودن بر روی true، گروه را اضافه کند و در صورت تنظیم بودن بر روی false، گروه را حذف کند.
duration
از نوع Number یا String است و به طور انتخابی طول دوره ی افکت را slow، normal، fast یا به هزارم ثانیه نشان می دهد. اگر حذف شود، متد animate() پیش فرض را تعیین می کند. مقدار پیش فرض آن ۴۰۰ است.
easing
نام عملکرد easing که به متد animate() منتقل می شود.
complete
یک متد بازگشتی است که وقتی متد برای یک عنصر کامل می شود، برای آن عنصر فراخوانده می شود.
افزوده شده به ورژن ۱٫۹ از jQueryUI
با ورژن ۱٫۹، اکنون این متد گزینه ی children را پشتیبانی می کند که همچنین عناصر بعدی را نیز متحرک سازی خواهد کرد.
toggleClass( className [, switch ] [, options ] )
Parameter
Description
className
این پارامتر یک String است که نام گروه CSS یا لیست فضای محدود از نام گروه (space-delimited list) که باید به آن اضافه شود، حذف شود یا toggle شود، را نشان می دهد.
switch
از نوع Boolean میباشد و اگر تعیین شده باشد، متد toggleClass() را وادار می کند تا در صورت تنظیم بودن بر روی true، گروه را اضافه کند و در صورت تنظیم بودن بر روی false، گروه را حذف کند.
options
این پارامتر همه ی تنظیمات مربوط به انیمیشن را نشان می دهد. همه ی پراپرتی ها انتخابی هستند. مقادیر ممکن عبارتند از:
duration: از نوع Number یا String می باشد و زمان اجرای انیمیشن را تعیین می کند. مقدار پیش فرض آن ۴۰۰ است.
easing: یک string است که عملکرد را برای استفاده برای تغییر آسان می کند. مقدار پیش فرض آن swing است.
complete: یک متد بازگشتی است که هنگامی که افکت برای یک عنصر کامل است، برای هر عنصر فراخوانده می شود.
children: از نوع Boolean است و نشان می دهد که آیا انیمیشن باید به طور اضافه برای همه ی عناصر هماهنگ شده ی بعدی، به کار گرفته شود.
queue: از نوع Boolean یا String است و نشان می دهد که آیا انیمیشن را در ردیف افکت ها قرار دهیم.
مثال:
مثال زیر استفاده از متد toggleClass() را توضیح می دهد:
.class1 {
border-width: 10px;
border-color: grey;
background-color: #cedc98;
color: black;
}
function toggle() {
$(“#para”).toggleClass(“class1”, 1000);
}
Welcome to Tutorials Point
روی دکمه ی Toggle کلیک کنید تا گروه های CSS را که برای متن تغییریافته اند، مشاهده کنید.
