Dropdowns در Bootstrap :
Dropdowns یکی از اجزای مهم و پرکاربرد در فریمورک Bootstrap است. با استفاده از Dropdowns میتوانید یک منوی کشویی را در وبسایت خود ایجاد کنید که شامل گزینههای مختلفی باشد.
برای استفاده از Dropdowns در Bootstrap، ابتدا باید لینکهای مورد نیاز را به پروژه خود اضافه کنید. سپس در کد HTML، یک المان div با کلاس “dropdown” ایجاد کنید. داخل این المان، یک دکمه با کلاس “dropdown-toggle” و با دیتا-تاگ “dropdown” قرار دهید. متن دکمه میتواند هرچیزی باشد که میخواهید.
در داخل المان div دکمه، باید یک المان div دیگر با کلاس “dropdown-menu” اضافه کنید. داخل این المان، گزینههای منو را با المانهای a اضافه کنید. هر المان a باید کلاس “dropdown-item” داشته باشد و به آن یک href دلخواه نیز اضافه کنید.
برای نمایش منوی Dropdown، باید به دکمه اصلی یک اسکریپت JavaScript اضافه کنید. این اسکریپت باید تابع dropdown() را بر روی المان دکمه فراخوانی کند. به عنوان مثال:
“`
“`
با این کار، منوی کشویی Dropdown در وبسایت شما قابل استفاده خواهد بود. هنگام کلیک بر روی دکمه، گزینههای منو نمایش داده میشود و کاربر میتواند یک گزینه را انتخاب کند.
همچنین، Bootstrap امکانات و ویژگیهای دیگری نیز برای Dropdowns ارائه میدهد. مثلاً میتوانید به گزینهها آیکونها یا تصویر اضافه کنید، یا گزینههای منو را به صورت چند ستونی نمایش دهید.
به طور کلی، Dropdowns در Bootstrap راهی آسان و انعطاف پذیر برای ایجاد منوی کشویی در وبسایت شماست. با استفاده از کلاسها و ویژگیهای Bootstrap، میتوانید ظاهر و عملکرد منوی کشویی را به دلخواه خود تغییر دهید.