The Tooltip Plugin
The Tooltip plugin kotak pop-up kecil yang muncul saat pengguna menggerakkan pointer mouse di atas unsur:
Tip: Plugin dapat dimasukkan secara individual (menggunakan Bootstrap's individu "tooltip.js" file), atau sekaligus (menggunakan "bootstrap.js" atau "bootstrap.min.js" ).
Cara Membuat Tooltip a
Untuk membuat tooltip, menambahkan data-toggle="tooltip" atribut untuk elemen.
Gunakan title atribut untuk menentukan teks yang harus ditampilkan dalam tooltip:
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a> Catatan: Tooltips harus diinisialisasi dengan jQuery: pilih elemen tertentu dan memanggil tooltip() metode.
Kode berikut akan memungkinkan semua tooltips dalam dokumen:
Contoh
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Cobalah sendiri " positioning Tooltips
Secara default, tooltip akan muncul di atas elemen.
Gunakan data-placement atribut untuk mengatur posisi tooltip di atas, bawah, kiri atau sisi kanan elemen:
Contoh
<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>
Cobalah sendiri " Tip: Anda juga dapat menggunakan data-placement atribut dengan nilai "auto", yang akan membiarkan browser menentukan posisi tooltip. Misalnya, jika nilai "auto left" , tooltip akan ditampilkan pada sisi kiri bila mungkin, jika di sebelah kanan.
Menyelesaikan Bootstrap Tooltip Referensi
Untuk referensi lengkap semua pilihan tooltip, metode dan peristiwa, pergi ke kami Bootstrap JS Tooltip Referensi .