Minggu, 19 Juni 2011

Membuat Tooltip yg keren di Blog



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(http://1.bp.blogspot.com/_S75uo-2cS2E/S4OUzirN6KI/AAAAAAAABCQ/WC2d22ar7hs/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
class="tooltip" href="http://LINK ARTIKEL BLOG ANDA">JUDUL ARTIKEL BLOG ANDAJUDUL ARTIKEL BLOG ANDA

- Untuk efek gambar maka kodenya seperti di bawah ini, lalu sisipkan pada link gambar yang di inginkan
class="tooltip" href="http://LINK ARTIKEL BLOG ANDA">JUDUL ARTIKEL BLOG ANDA
JUDUL ARTIKEL BLOG ANDA

- Jika sudah maka selesai...

0 komentar:

Poskan Komentar

Jangan lupa komentarnya.....

Ada kesalahan di dalam gadget ini