قائمة البرجر هي عنصر مستخدم على نطاق واسع في تصميم الهاتف المحمول وهو المسؤول عن عرض التنقل الرئيسي على موقع ويب أو تطبيق. إنه حل مضغوط ومريح لتوفير مساحة الشاشة وتحسين تجربة المستخدم. في هذه المقالة ، سننظر في كيفية إنشاء قائمة برجر ، وشرح خطوات التثبيت الأساسية ، ومشاركة النصائح حول تصميمها.
. فكر مسبقا في هيكل العناصر وترتيبها بحيث تكون قائمتك منطقية وسهلة الاستخدام.
بعد إضافة رمز هتمل ، تحتاج إلى البدء في إضافة الأنماط. للقيام بذلك ، يمكنك استخدام أطر كس مثل بوتستراب أو مؤسسة ، والتي توفر مكونات وفئات جاهزة لإنشاء قوائم برغر. إذا كنت تفضل إنشاء قائمة من البداية ، فستحتاج إلى تحديد أنماط للحالات المختلفة لقائمة البرجر: مفتوحة ، مغلقة ، تحوم ، إلخ.
من المهم أن تتذكر استجابة قائمة البرجر. سيعرض المستخدمون موقعك على أجهزة مختلفة ، لذلك يجب أن تتكيف القائمة جيدا مع جميع الشاشات. للقيام بذلك ، استخدم استعلامات وسائط كس أو وحدات جافا سكريبت التي تسمح لك بسهولة تغيير مظهر القائمة اعتمادا على حجم الشاشة.
يعد إعداد وتصميم قائمة البرجر مراحل مهمة من الإنشاء ، حيث يؤثران على سهولة الاستخدام وسلامة النمط المرئي لموقعك. استخدم الاتجاهات الحديثة وتقنيات التصميم لإنشاء قائمة جذابة وبديهية-سيساعد ذلك على زيادة رضا المستخدمين وتحسين معدل التحويل لموقعك.
- تثبيت قائمة البرجر: تعليمات خطوة بخطوة
- الخطوة 1: توصيل ملفات كس وجافا سكريبت
- الخطوة 2: إنشاء ترميز هتمل للقائمة
- الخطوة 3: إضافة الأنماط والرسوم المتحركة
- سؤال وجواب
- أي تصميم القائمة سيكون الأكثر سهولة في الاستخدام?
- هل من الممكن إضافة الرسوم المتحركة إلى القائمة برغر?
تثبيت قائمة البرجر: تعليمات خطوة بخطوة
تعد قائمة البرجر طريقة شائعة لتنظيم قائمة التنقل على موقع الويب. يوفر الاكتناز والراحة للمستخدمين على الأجهزة المحمولة. في هذا القسم ، سنلقي نظرة على الإرشادات خطوة بخطوة لتثبيت قائمة برجر على موقع الويب الخاص بك.
الحشو: 0;
عرض: لا شيء;
الحشو: 10 بكسل;
}
.القائمة لى: تحوم {
القائمة.قائمة الفصل.تبديل ('فتح');
يضيف هذا الرمز معالج حدث نقرة لرمز قائمة البرجر. عند النقر عليها ، سيتم فتح القائمة وإغلاقها.
تحقق من قائمة البرجر على موقع الويب الخاص بك.
الخطوة 1: توصيل ملفات كس وجافا سكريبت
قبل البدء في إنشاء قائمة برغر ، تحتاج إلى توصيل ملفات كس وجافا سكريبت لعملها السليم. تحتوي هذه الملفات على أنماط ونصوص تسمح لك بإنشاء قائمة تفاعلية.
لتوصيل ملفات كس ، استخدم العلامة
مع القيمة
من السمة ريل
يساوي" ورقة الأنماط " والسمة
هريف
مع المسار إلى ملف كس. على سبيل المثال:
في هذا المثال
كما القائمة.ملف المغلق
تحتوي على أنماط لقائمة البرجر.
لتوصيل ملفات جافا سكريبت ، استخدم العلامة
مع القيمة
من سمة سرك
تحديد المسار إلى ملف جافا سكريبت. على سبيل المثال:
في هذا المثال ، ملف
مرفق