Offcanvas

نسخه آزمایشی

از دکمه های زیر برای نمایش و پنهان کردن یک عنصر offcanvas از طریق جاوا اسکریپت استفاده کنید که کلاس .show را روی یک عنصر با علامت تغییر می دهد .offcanvas کلاس

لینک با href
Offcanvas
مقداری متن به عنوان جانگهدار. در زندگی واقعی می‌توانید عناصری را که انتخاب کرده‌اید داشته باشید. مانند متن، تصاویر، لیست‌ها و غیره.
جایگذاری

مثال قرارگیری متفاوت Offcanvas: چپ، راست و پایین

Offcanvas بالا
...
Offcanvas انتها
...
Offcanvas پایین
...
پس‌زمینه (Backdrop)

پیمایش عنصر زمانی که یک بوم نقاشی و پس‌زمینه آن قابل مشاهده هستند، غیرفعال می‌شود. از ویژگی data-bs-scroll برای فعال یا غیرفعال کردن پیمایش و از ویژگی data-bs-backdrop برای فعال یا غیرفعال کردن پس‌زمینه استفاده کنید.

رنگی با قابلیت اسکرول

برای دیدن این گزینه در عمل، بقیه صفحه را اسکرول کنید..

Offcanvas با پس‌زمینه

.....

پس‌زمینه با قابلیت اسکرول

برای دیدن این گزینه در عمل، بقیه صفحه را اسکرول کنید..

پیمایش Body

وقتی یک بوم نقاشی و پس‌زمینه‌اش قابل مشاهده باشند، پیمایش عنصر غیرفعال است.

Offcanvas با اسکرول body

برای دیدن این گزینه در عمل، بقیه صفحه را اسکرول کنید..

پس‌زمینه استاتیک (Static Backdrop)

وقتی پس‌زمینه روی استاتیک تنظیم شده باشد، بوم نقاشی با کلیک کردن خارج از آن بسته نمی‌شود.

Offcanvas
اگر خارج از من کلیک کنید، نمی‌بندم..
پیمایش Body و پس‌زمینه

پیمایش عنصر زمانی غیرفعال است که یک بوم خاموش و پس‌زمینه آن قابل مشاهده باشد. از ویژگی data-bs-scroll برای فعال یا غیرفعال کردن پیمایش و از data-bs-backdrop برای فعال یا غیرفعال کردن پس‌زمینه استفاده کنید.

پس زمینه با اسکرول

برای دیدن این گزینه در عمل، بقیه صفحه را اسکرول کنید..