Cara Membuat Gambar Membesar ketika Di Sorot Mouse Pada Blog

Share on Facebook

Share on Twitter

Share on Google+

Share on LinkedIn

 

Cara Membuat Image/Gambar Membesar Ketika di Sorot Mouse Pada Blog. sobat blogger mungkin pernah melihat ketika mengunjungi sebuah blog, dimana ketika sobat secara sengaja/tidak sengaja mengarahkan mouse ke arah gambar, maka gambar tersebut secara otomatis membesar.

Sebagian blogger memang sengaja membuat efek zoom image pada blog mereka, tujuan utamanya adalah mempercantik blognya, namun disisi lain ada hal yang menurut saya perlu di terapkan pada blog sobat karena dengan efek ini, secara tidak langsung telah membantu mengurangi berat loading blog sobat. kenapa demikian.??? karena kita tidak perlu lagi memasang gambar di blog dengan ukuran yang besar, jadi cukup gambar kecil saja, Toh dengan efek zoom ini gambar yang kecilpun akan membesar ketika di sorot mouse.

Oke sob. Penasaran dengan tips bagaimana membuat efek zoom pada gambar di blog??? simak Tutorialnya di bawah ini ya:

Cara Membuat Gambar/Image Membesar ketika Di Sorot Mouse Pada Blog.

1. Masuk ke accound Blogger Anda.
2. Pilih template.
3. Klik Edit Html.
4. Cari Kode ]]></b:skin> (gunakan Ctrl+f Untuk mempermudah pencarian)
5. Copy dan Paste kode di bawah ini tepat di atas kode ]]></b:skin>

.post .post-body img{margin:5px; padding:5px; border:1px solid #e0e0e0; -o-transition: all 0.5s; -moz-transition:all 0.5s; -webkit-transition: all 0.5s;}<br /> .post .post-body img:hover{-o-transition:all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform:scale(1.2); -o-transform:scale(1.2); -webkit-transform:scale(1.2);}

6. Selesai Save/simpan.

Demikian tutorial tentang cara membuat gambar/Image membesar ketika di sorot Mouse Pada blog, Semoga bermanfaat bagi sobat blogget semua.

SELAMAT BERKARYA.. HAPPY BLOGGING.

]]></b:skin>

]]></b:skin>

]]></b:skin>

]]></b:skin>

Artikel Terkait