انتقل إلى محتوى الدرس

Toast Notification Anatomy مفهوم وتشريح الإشعارات العائمة

أنشئ إشعارات عائمة غير حاجبة Toasts في Bootstrap 5.3 عبر واجهة جافاسكريبت البرمجية وحاويات التموضع والتكديس والألوان المدمجة ومهلة الاختفاء التلقائي وسمات ARIA القياسية.
3 صفوف تعليمية
بوتستراب 5
1 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تحاكي الإشعارات العائمة Toasts في Bootstrap 5.3 تنبيهات أنظمة التشغيل الحديثة وتطبيقات الهواتف؛ فهي رسائل خفيفة غير حاجبة Non-blocking تظهر في زاوية الشاشة لتأكيد حفظ مسودة أو وصول رسالة جديدة دون مقاطعة عمل المستخدم أو إعتام الصفحة كما تفعل النوافذ الحوارية Modals.

يتألف الإشعار القياسي من غلاف .toast يضم بالداخل شريط رأس اختياري .toast-header (يحوي عنوان المصدر بصيغة .me-auto، والطابع الزمني، وزر الإغلاق data-bs-dismiss="toast") متبوعاً بجسم الرسالة .toast-body.

الصف 2 صورة توضيحية
مخطط التشريح المعماري للإشعار العائم toast ورأسه ومتنه وتفعيله عبر bootstrap.Toast
الصف 3 ملاحظة هامة