Cara buat tooltip di blogspot

Sekarang aku akan memberikan sedikit pengalaman ku tentang cara membuat tooltip pada blog, ada yang tau apa itu tooltip..? jadi, tooltip adalah kata-kata yang muncul ketika mouse di arahkan ke gambar atau tulisan,,bagaimana cara membuatnya..? ikuti cara berikut ini :

Langkah ke 1 :
- Login Blog
- Terus Klik Tata Letak/Layout
- Klick Edit HTML. 
- Lalu cari Kode yang seperti ini : ]]></b:skin>
- Jika sudah ketemu, silahkan copy kode dibawah ini dan pastekan di atas kode ini ]]></b:skin>

a.tooltip {position:relative}
a.tooltip span {
display:none;
padding:4px 5px 4px 6px;
z-index:100;
background:#000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk2SXcWYbGByXqTahQTwt2o-AySiVHDnD0CHlI5aqUjAXneTjGjd0qiGCECfdG2zzroKq09IpTYy6o86wb_Htr1okmiqsytN6Fam4RkgBC5hsaZy5rmcw0w1awiHeWpJjm5LpXsHcIt2rK/s320/nav.gif) repeat-x;
color:#FFFFFF;
text-decoration:none;
width:100%;
height:auto;
text-align:center;
-moz-border-radius:5px;
border:1px solid #999999;
}
a:hover.tooltip {
font-size:99%;
cursor:pointer
}
a:hover.tooltip span {
display:block;
position:absolute;
-moz-opacity:0.9;
top:auto;
left:auto;
right:-20px;
bottom:30px;
line-height:14px;
font-size:12px;
font-weight:normal;
}

-Klik Save

Langkah ke 2 : 

- Efek tulisan agar muncul tooltip, copy paste kode di bawah lalu sisipkan pada link tulisan yang di inginkan

<a class="tooltip" href="http://LINK ARTIKEL BLOG ANDA">JUDUL ARTIKEL BLOG ANDA<span><strong>JUDUL ARTIKEL BLOG ANDA</strong></span></a>

- Untuk efek gambar maka kodenya seperti di bawah ini, lalu sisipkan pada link gambar yang di inginkan

<a class="tooltip" href="http://LINK ARTIKEL BLOG ANDA">JUDUL ARTIKEL BLOG ANDA<span><center><img src="http://GANTI DENGAN LINK GAMBAR ANDA"/></center><strong>JUDUL ARTIKEL BLOG ANDA</strong></span></a>

- Jika sudah maka selesai... dan tetap jangan lupa tinggalkan komentar y....

Artikel Terkait