Jumat, 27 Agustus 2010

Font Berubah Saat Disorot Mouse


Sebelumnya saya mengucapkan terima kasih kepada teman-teman blogger yang telah berkunjung ke blog saya. Pada postingan ini saya akan mencoba menjawab salah satu pertanyaan sahabat blogger saya :

"kang bagimana caranya merubah font ketika disentuh oleh mouse berganti bentuk.tak tunggu jawabannya"


Sebenarnya cara ini sama dengan cara memperbesar link yang telah saya jelaskan pada artikel saya sebelumnya. Jika kalian belum membacanya silahkan klik DISINI.
Hanya saja cara ada perbedaan sedikit kode yang ditambahkan. Berikut tahap-tahapnya:

1. Login Ke blogger kalian
2. Pilih Rancangan
3. Pilih Edit HTML ( biasakan untuk mencentang pada box expand widget template )
4. coba kalian cari kode berikut :

a:link {
color:#333;
text-decoration:none;
font-family:'verdana';
}

a:hover {
color:#777;
text-decoration:underline;
}


Keterangan :
== Kode diatas mungkin tidak selalu mirip pada setiap template tapi intinya sama
== a:link berarti keadaan link saat normal
== a:hover berarti keadaan link saat disorot mouse

jadi intinya jika kita ingin huruf/font berubah saat disorot mouse, kalian tinggal menambahkan kode berikut pada css a:hover

font-family:'JENIS HURUF KALIAN';


Sebagai contoh hasilnya seperti ini :

a:link {
color:#333;
text-decoration:none;
font-family:'verdana';
}

a:hover {
color:#777;
text-decoration:underline;
font-family:'Kristen ITC';
}

Kode diatas berarti saat dalam keadaan normal jenis huruf adalah 'verdana' tapi ketika disorot mouse jenis huruf berganti menjadi 'kristen ITC'. kalian bisa menggantinya dengan huruf yang kalian inginkan.

KESIMPULAN :

sebenarnya jika kita ingin merubah baik itu huruf, warna, ukuran dan yang lainnya saat disorot mouse, kalian harus fokus pada setiap kode yang bertuliskan HOVER, contohnya seperti ini :

untuk gambar biasanya kodenya img hover { ...
untuk huruf biasanya kodenya a:hover {
dan seterusnya ....

Dalam kode tersebutlah kalian menambahkan atau mengganti kode yang akan dirubah saat di sorot mouse.
Pokoknya sekali lagi saya sarankan kalian fokus pada setiap kata HOVER.

Selamat mencoba dan semoga bermanfaat

No comments yet