Responsive Offcanvas Menusاللوحات المتجاوبة عبر الشاشات
أتقن بناء اللوحات الجانبية المنزلقة Offcanvas في بوتستراب 5 لسلات التسوق والفلاتر، وتعلّم مواضعها المنطقية الأربعة وخيارات التمرير والخلفية الثابتة واللوحات المتجاوبة عبر الشاشات وواجهة جافاسكريبت.
4 صفوف تعليمية
بوتستراب 5
1 مشاهدة
شرح صفوف ومحتوى الفقرة
الصف 1
شرح توضيحي
من أذكى مزايا الإصدار 5.2+ و5.3 عائلة الكلاسات المتجاوبة .offcanvas-sm وحتى .offcanvas-xxl (وأشهرها .offcanvas-lg)؛ فهي تحوّل الكتلة نفسها إلى درج منزلق مخفي على الشاشات الأصغر من lg، وتعرضها كقسم ثابت عادي داخل تخطيط الصفحة على شاشات الحاسوب دون الحاجة لتكرار عناصر HTML مرتين!
تذكر فقط إخفاء زر الفتح وزر الإغلاق على الشاشات الكبيرة بإضافة .d-lg-none وتمرير معرّف الهدف صراحةً على زر الإغلاق data-bs-target="#id".
الصف 2
صورة توضيحية
الصف 3
معاينة حية
الصف 4
ملاحظة هامة
جميع فقرات هذا الدرس (اللوحات الجانبية المنزلقة في بوتستراب 5)