Cara Membuat Efek Link Membesar Saat Disentuh Kursor

Cara Membuat Efek Link Membesar Saat Disentuh Kursor – Tutorial pada hari Minggu ini tidak jauh jauh dari manipulasi CSS. Dimana, saya akan membahas trik untuk membuat link terlihat membesar ukurannya saat dilintasi oleh pointer atau kursor. Tujuannya hanya satu, yaitu untuk menambah nilai seni dari blog, sama dengan pemasangan efek bayangan pada link ataupun pengubahan bentuk cursor menjadi bentuk lain. Untuk trik lainnya, Anda bisa lihat disini. Silahkan lihat previewnya pada gambar berikut.

Oke, langsung saja. Untuk Anda yang ingin mencoba memasang efek link membesar ini, silahkan ikuti langkah berikut :

1.    Buka akun Blogger Anda, lalu masuk ke Template. Buatlah sebuah backup dari template blog Anda, lalu klik Edit HTML.

2.    Tekan CTRL+F, dan cari kode a:hover { . Kodenya kurang lebih seperti ini (umumnya pada setiap template blog berbeda, namun cari yang mendekati/mirip) :

a:hover {

color:#325C1C;

text-decoration:underline;

text-shadow:5px 5px 5px #000;

}

3.    Tambahkan kode font-size:18px; pada baris terakhir, sebelum } . Sehingga kodenya akan menjadi seperti ini :

a:hover {

color:#325C1C;

text-decoration:underline;

text-shadow:5px 5px 5px #000;

font-size:18px;

}

Catatan :

-     18px menunjukkan ukuran font pada link saat pointer diletakkan diatasnya (dalam satuan piksel). Gantilah sesuai dengan keinginan.

-     Jika parameter font-size: sudah ada dalam template blog Anda, cukup ganti nilai (angka sebelum px) ukuran font untuk memberikan efek link membesar pada blog.

4.    Terakhir, klik Simpan.

Selamat mencoba ‘mengagetkan’ pengunjung blog Anda dengan link yang membesar! Tolong share dan berikan artikel ini Google +1. Terima kasih, dan salam blogger!