December 14, 2015

Image Hover Only on Linked Images




Apa tu maksudnya? Anda faham?. Macam ni.. Maksudnya effect hover yang korang buat tu akan jadi dekat gambar yang korang linkkan sahaja. Gambar yang tiada link, tak akan jadi apa-apa melainkan kalau korang ada tambah apa-apa code di bahagian post image dalam Edit HTML. Contohnya, di Edit HTML bahagian post image korang ada masukkan hover effect shadow, jadi walaupun korang letak coding Beeha bagi ni kira tak menjadi lah.. Disebabkan ada coding hover effect shadow di bahagian post image, gambar yang berlink atau pun tidak tak akan nampak beza, dua-dua akan nampak effect bila cursor menyentuh.

Korang faham ke tak ni? Rasa macam berbelit pulak ayat Beeha tu kan. Tapi tak pe, korang try dulu coding Beeha bagini, nanti korang akan nampak apa bezanya.


1. Sign In ---> Dashboard ---> Template ---> Edit HTML

2. Ctrl+F and search
/* Header

3. Then , copy this code and paste it before /* Header.

a:link img {  opacity: 1.0;  filter: alpha(opacity=100);}
a:hover img.thumb-image {  opacity: 0.6;  filter: alpha(opacity=60); }


4. Preview, and SAVE if no error.


ATTENTION ! : Kalau korang pandai main dengan coding, korang boleh ubah perkataan yang Beeha highlight warna merah tu. Korang pandai2 lah cari coding image hover yang lain. Contohnya , nak yang gambar jadi bulat apa cursor menyentuh ke, ataupun gambar senget sikit apabila disentuh. Bila dah ada code tu, pandai2 la ubah code tu. Make sure, yang hover di bahagian hover.



P/S : Minta maaf yea kalau ada yang tak faham. Apa- apa masalah korang boleh leave comment di bawah ye. Terima kasih. :)




No comments:

Post a Comment

Feel free to leave your comment here. Thank you. ;)