Bootstrap 4 تلميح
Bootstrap 4 تلميح
مكون تلميح الأدوات عبارة عن مربع منبثق صغير يظهر عندما يحرك المستخدم مؤشر الماوس فوق عنصر:
كيفية إنشاء تلميح
لإنشاء تلميح أداة ، أضف data-toggle="tooltip"
السمة إلى عنصر.
استخدم titleالسمة لتحديد النص الذي يجب عرضه داخل تلميح الأداة:
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
ملاحظة: يجب تهيئة تلميحات الأدوات باستخدام jQuery: حدد العنصر المحدد واستدعاء 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>
استكمال مرجع تلميحات Bootstrap
للحصول على مرجع كامل لجميع خيارات تلميح الأدوات والأساليب والأحداث ، انتقل إلى مرجع تلميح Bootstrap JS الخاص بنا .