أحدث البرامج التعليمية وتطوير الشبكة
 

Bootstrap البرنامج المساعد تلميح الأدوات


تلميح الأدوات المساعد

البرنامج المساعد تلميح الأدوات صغير المنبثقة المربع الذي يظهر عندما يحرك المستخدم مؤشر الماوس فوق عنصر:

تحوم فوق لي

نصيحة: الإضافات يمكن تضمينها بشكل فردي (باستخدام Bootstrap's فرد "tooltip.js" ملف)، أو في كل مرة (باستخدام "bootstrap.js" أو "bootstrap.min.js" ).


كيفية إنشاء تلميح الأدوات

لإنشاء تلميح الأدوات، إضافة data-toggle="tooltip" السمة إلى عنصر.

استخدام title سمة لتحديد النص الذي يجب عرضه داخل تلميح الأدوات:

<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>

ملاحظة: تلميحات يجب تهيئة مع مسج: اختيار العنصر المحدد واستدعاء tooltip() الأسلوب.

سوف التعليمة البرمجية التالية تمكين جميع تلميحات في الوثيقة:

مثال

<script>
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip();
});
</script>
انها محاولة لنفسك »

المواقع تلميحات

افتراضيا، ستظهر تلميح الأدوات في أعلى العنصر.

استخدام data-placement السمة إلى تعيين موضع من تلميح الأدوات في أعلى أو أسفل أو إلى اليسار أو الجانب الأيمن من العنصر:

مثال

<a href="#" data-toggle="tooltip" data-placement="top" title="Hooray!">Hover</a>
<a href="#" data-toggle="tooltip" data-placement="bottom" title="Hooray!">Hover</a>
<a href="#" data-toggle="tooltip" data-placement="left" title="Hooray!">Hover</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Hooray!">Hover</a>
انها محاولة لنفسك »

نصيحة: يمكنك أيضا استخدام data-placement السمة مع قيمة "السيارات"، والتي سوف تسمح للمتصفح أن يقرر الموقف من تلميح الأدوات. على سبيل المثال، إذا كانت القيمة "auto left" ، وتلميح الأدوات عرض على الجانب الأيسر عندما يكون ذلك ممكنا، وإلا على اليمين.


استكمال التمهيد تلميح الأدوات المرجعي

للإشارة كاملة من كل تلميح الأدوات خيارات والأساليب والأحداث، انتقل إلى لدينا التمهيد شبيبة تلميح الأدوات المرجعي .