Membuat Tooltip Pada Bootstrap

Pada artikel kali ini saya kan membuat sebuah tooltip dengan plugin bootstrap, nah seperti yang kita tau tooltip adalah Komponen grafis dalam user interface pengguna. Komponen ini biasanya muncul ketika pointer mouse diarahkan ke komponen. Tooltip dapat berisi bantuan maupun informasi lain yang terkait dengan komponen tersebut,

oke untuk lebih jelasnya kita langsung saja praktekan, silahkan buat file dan ketikan script htnl berikut :

<div class="container">
  <h3>Contoh Tooltip</h3>
  <a href="#" data-toggle="tooltip" title="Hooray!">KLIK</a>
</div>

pada kasus ini saya menganggap teman-teman sudah memanggil css bootstrap dan plugin jquery yang kita butuhkan, oke sekarang coba tambahkan javascript berikut :

<script>
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip();   
});
</script>

Jika sudah save dan lihat asilnya, maka hasilnya akan seperti berikut :

jika kursor kita arahkan pada link klik, maka akan muncul tooltipnya, simple kan, selamt mencoba teman-teman, semoga bermanfaat, terimakasih 🙂

Kategori