Cara membuat Morph CSS image hover effect di Blog

HaiSob apa kabar 😀 ? Pada saat ini saya akan berbagi Morph CSS image hover effect.

Banyak sekali efek-efek yang bisa kamu tambahkan untuk membuat gambar di postinganmu menjadi lebih menarik, Misalnya dengan menambahkan efek hover gambar seperti Morph image hover efek ini.

Morph Efek hover pada gambar di sini adalah efek yang muncul ketika cursor pointer mouse ada di atas gambar pada postingan blog kamu.

Morph Image Hover Effect


Morph CSS image hover effect
Morph CSS image hover effect


Memasang Morph CSS image hover effect di Blogger


1. Di Blog Blogger 😊
2. Pilih menu Template ➔ Edit HTML
Morph CSS image hover effect
Template - Edit HTML

3. Letakan kode dibawah ini di atas kode ]]></b:skin> atau di atas </style>
.post-body img { -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease; }
.post-body img:hover { border-radius:50%; -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg); -ms-transform:rotate(360deg); transform:rotate(360deg); }
4. Save.

Cek gambar di postinganmu apa sesuai harapan atau tidak, jika tidak edit CSS diatas sesuaikan dengan CSS template blog kamu.

Sekian Morph CSS image hover effect semoga bermanfaat.