Cara Membuat Gambar Membesar Saat Dilewati Kursor di Blog

Cara Membuat Gambar Membesar Saat Dilewati Kursor di Blog - Diantara sekian ribu blog yang pernah anda kunjungi pasti anda sempat menemui entah itu sengaja maupun tidak, blog yang gambarnya membesar ketika dilewati kursor. Oleh sebagian orang hal tersebut dapat memperindah blog, namun tidak sedikit yang berasumsi bahwa efek -efek zoom- seperti itu hanya mengganggu saja. Apapun alasannya, tersedah anda. Entah itu membuat nyaman atau tidak, itukan selera anda. Baiklah melalui postingan ini saya akan berbagi cara membuat gambar membesar ketika dilindas atau disambar kursor. Berikut caranya.


  • Login ke akun blogger anda
  • Klik Template > Edit HTML centang pada Expand Template Widget
  • Cari kode ]]></b:skin> , setelah itu, letakkan kode dibawah ini tepat diatas kode ]]></b:skin>
.post img, table.tr-caption-container { border:none; max-width:800px; height:auto; -o-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; }
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.5); -o-transform: scale(1.5); -webkit-transform: scale(1.5); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6); }

  • Setelah itu simpan template dan lihat hasilnya
  • Selesai
Selamat mencoba. Semoga bermanfaat.

Advertisement