January 20, 2016

Image Hover Only On Body Post





Tuto lagi malam ni. Hehee. Saja je lahh Beeha buat sebagai notes Beeha. Senang jea nanti search sini balik , kan? So, malam ni tuto pasal hover. Tapi lain sikit dari yang sebelum ni. Sebelum ni, Beeha buat tuto image hover untuk linked image.

Boleh KLIK SINI untuk lihat tuto Beeha yang sebelum ini.


Harini lain sikit... Beeha akan buat tuto image hover hanya image di post body. Maksudnya, header or footer tak akan jadi hover lah bila cursor menyentuh. Ia akan hover pada gambar di entry post sahaja. So, sedap laa mata memandang. Kadang-kadang bila dah ada hover ni, contohnya nak buat hover gambar berputar 360 darjah pada gambar di post body, tapi dengan header and footer sekali berputar 360 darjah. Dah jadi tak kemas kan? Siapa yang nak hover hanya berlaku pada gambar di entry post boleh ikut Beeha punya step. :)



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

2. Click both Ctrl and F. Search
/* Posts
----------------------------------------------- */

3. Copy this code and paste it after the code you search before this.
.post-body img {
opacity:1.0;
}

.post-body img:hover {
opacity:0.7;
}

4. Preview and Save if no error.










No comments:

Post a Comment

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