Latest web development tutorials

شريط التنقل مسج موبايل

شريط التنقل هو عبارة عن مجموعة من الارتباطات المرتبة أفقيا تكوينها، الواردة عادة داخل الرأس أو الذيل.

افتراضيا، فإن الروابط في شريط التنقل تصبح تلقائيا على زر (دون دور البيانات = "الزر").

باستخدام-دور البيانات = "نافبار" السمة لتحديد شريط التنقل:

أمثلة

<div data-role="header">
<div data-role="navbar" >
<ul>
<li><a href="#anylink">首页</a></li>
<li><a href="#anylink">页面二</a></li>
<li><a href="#anylink">搜索</a></li>
</ul>
</div>
</div>

محاولة »

مصباح افتراضيا، عرض على زر ومحتوياته نفس. استخدام قائمة غير مرتبة لتقسيم بالتساوي عرض الأزرار: زر واحد إلى 100٪ من عرض اثنين من أزرار تمثل كل ل50٪ من عرض ثلاثة أزرار تمثل كل ل33،3٪ من العرض، وهلم جرا. ومع ذلك، إذا قمت بتحديد أكثر من خمسة أزرار في شريط التنقل سيتم تقسيمها إلى عدة أسطر (راجع "مزيد من أمثلة").

الأيقونات الملاحة

يمكننا استخدام السمة رمز البيانات لإضافة رموز لأزرار التنقل:

أمثلة

<a href="#anylink" data-icon="search"> البحث </A>

محاولة »

ويعزو-رمز البيانات مع قسم الدرجة CSS رمز باستخدام نفس القيمة. الطبقة CSS لاستخدام الطبقة = "قيمة واجهة المستخدم icon-" ، أيقونة بيانات تنسب لاستخدام البيانات رمز = "قيمة".

قيمة الممتلكات وصف رمز
بيانات رمز = "الوطن" منزل
بيانات رمز = "السهم ص" على السهم الأيمن
بيانات رمز = "بحث" بحث

لدليل مرجعي كامل لجميع الأيقونات مسج جوال، قم بزيارة موقعنا مسج موبايل دليل رمز المرجعي .


رمز الدولة

مثل "موقف BTN اجهة المستخدم-icon-" نفس الفئة (القسم رمز موصوفة في التفاصيل)، ويمكنك ان تحدد موقع الرمز المعروض: أعلى (الرأس)، والحق (على اليمين)، أسفل (القاع) أو اليسار (على اليسار ).

وتقدم أيقونة الموقع على الحاوية شريط التنقل، وذلك باستخدام-iconpos بيانات تنسب لتحديد الموقع:

قيمة الممتلكات وصف أمثلة
، iconpos البيانات = "القمة" محاذاة رمز كبير محاولة
، iconpos البيانات = "الحق" رمز على حق الانحياز محاولة
، iconpos البيانات = "القاع" محاذاة رمز القاع محاولة
، iconpos البيانات = "اليسار" محاذاة رمز اليسار محاولة
مذكرة افتراضيا، يقع على أيقونة فوق النص أزرار التنقل (-iconpos البيانات = "القمة").

زر التنشيط

عند النقر على رابط على شريط التنقل، فإنه سيتم اختيارهم (ضغط) مظهر.

إذا كنت ترغب في الحصول على هذا المظهر لا تقم بالنقر فوق الارتباط، استخدام الطبقة = "BTN نشطة واجهة المستخدم":

أمثلة

<li><a href="#anylink" class="ui-btn-active" >首页</a></li>

محاولة »

لصفحات متعددة، قد ترغب في التحقق من ظهور كل زر نيابة عن الصفحة الحالية يقع المستخدم. للقيام بذلك، قم بإضافة "واجهة المستخدم للدولة، لا تزال قائمة" وصلة "، BTN اجهة المستخدم النشط" إلى الفئة:

أمثلة

<li><a href="#anylink" class="ui-btn-active ui-state-persist" >首页</a></li>

محاولة »


أمثلة

مزيد من الأمثلة

شريط التنقل المحتوى
كيف يمكنك إضافة شريط التنقل داخل-دور البيانات = "المحتوى".

شريط التنقل الذيل
كيف يمكنك إضافة شريط التنقل في الجزء الخلفي.

رمز الهدف في شريط التنقل
كيفية العثور على رمز شريط التنقل في الذيل.

أكثر من خمسة أزرار
زر 10 تجريبي في شريط التنقل.