Cara Membuat Gambar Membesar Saat Tersentuh Cursor

Cara Membuat Gambar Membesar Saat Tersentuh Cursor. Mungkin anda sudah sangat sering melihat di blog-blog lain kalo gambar di sentuh cursor maka gambar akan membesar (Zoom) Seperti di blog Kompi Ajaib. Sobat juga bisa membuat agar gambar di blog anda juga bisa membesar saat di sentuh kursor. jika anda ingin membuat nya, mari ikuti langkah mudah nya di bawah ini. Untuk Membuat Mambar Membesar Saat Tersentuh Kursor kita hanya menambahkan CSS saja pada Template blog Sobat, Dan tanpa javascript. Sehingga loading blog kita tidak terasa berat.

1. Pertama Anda masuk akun blogger anda.
2. Di Dasbor blog, pilih menu kemudian klik Tempate terus Edit HTML
3. Kemudian letakkan kode di berikut ini di atas </head>

;<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <style type='text/css'> .post-thumbnail{float:left;margin:0;padding:0;width:90%;overflow:hidden} .post-thumbnail img{display:block;width:100%;height:100%;max-width:none;max-height:none;min-width:0;min-height:0;margin:0;padding:0;border:none;outline:0;position:static;transition:all .8s ease-out;border-radius:5px !important;overflow:hidden} .post-thumbnail img:hover{-webkit-transform:scale(1.3);-ms-transform:scale(1.3);-o-transform:scale(1.3);transform:scale(1.3);} </style> </b:if> </b:if>

Dan sekekarng Klik simpan. Dan coba anda lihat di Homepage (Beranda) blog anda dan arahkan kursor pada gambar.
PERHATIAN: Apabila anda sudah mengikuti cara di atas tetapi tidak berfungsi (Gambar masih Tidak Membesar) silahkan Ganti .post-thumbnail Sesuai struktur pada template anda. karana setiap template memiliki struktur yang berbeda-beda.
Cukup sampai di sini postingan Cara Membuat Gambar Membesar Saat Tersentuh Cursor Selamat mencoba.

Sumber: KompiAjaib.com