Trik Komputer: Simple Pretty Tooltip

Jumat, 23 Juli 2010

Simple Pretty Tooltip

Tooltips memang mempercantik penampilan title pada link yak sob :p Sebelumnya Beben si bloglang pernah memosting . Disana ada variabel penulisan sebuah link dalam menggunakannya. Nah, sekarang bagaimana tooltip ini bisa muncul hanya dengan penulisan biasa pada sebuah link tanpa embel-embel variabel :-/ Tooltip yang muncul nanti akan memberikan keterangan atas yaitu title sobat, dan yang bawah address linknya.

Pake script sob :D dan sedikit CSS yah kalau mau ;)) Aturan script harus disimpan pada bagian bawah, maka waktu aku praktekan menyimpan script tersebut persis sebelum tag </body> bisa jalan tuh :D Kalau tidak jalan sobat bisa menyimpan scriptnya dibawah tag <head> Dan letakan CSS berikut sebelum tag ]]></b:skin>

div.nicetitle {
position: absolute;
padding: 4px;
top: 0px;
left: 0px;
color: white;
font-size: 13px;
font-family: Verdana, Helvetica, Arial, sans-serif;
width: 25em;
font-weight: bold;
background: url(NTBG.PNG);

/* Mozilla proprietary */
-moz-border-radius: 10px;
}
div.nicetitle p {
margin: 0; padding: 0 3px;
}
div.nicetitle p.destination {
font-size: 9px;
text-align: left;
padding-top: 3px;
}

Ganti tulisan warna merah itu dengan sebuah gambar yak sob. Ini dari tadi nerangin kesana kemari, scriptnya mana gambarnya mana :)) =)) Ya sudah untuk mendapatkan demo, script dan gambarnya sobat bisa klik tombol readmorenya yah :"> :D Silahkan kesini , you want more . bai bai :-h

Trik Komputer

Jumat, 23 Juli 2010

Simple Pretty Tooltip

Tidak ada komentar:

Posting Komentar