Efek Zoom Image With Css

Artikel selanjutnya di blog baru ini kita akan membahas tentang membuat efek image/gambar membesar ketika di sorot mouse, untuk lankah-langkahnya sebagai berikut :

1. Login Ke Akun Blogger Sobat
2. Klik Template Kemudian centang expand widget template
3. Selanjutnya cari kode ]]></b:skin> dan taruh kode CSS dibawah ini tepat diatas kode ]]></b:skin>
Ini Kode CSS Nya

.bteffect {
-webkit-transition:  -webkit-transform .15s linear;
-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
padding: 5px 5px 5px 5px;
-webkit-transform:  rotate(+2deg);
-moz-transform: rotate(+2deg);
}
.bteffect:hover {
-webkit-box-shadow:  0 3px 6px rgba(0,0,0,.5);
-moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);
-webkit-transform:  rotate(-1deg);
-moz-transform: rotate(-1deg);
}

4. kemudian jika sobat ingin memposting sebuah gambar jangan lupa sisipkan kode
Ini Kode CSS Nya

<img class="bteffect"src="LINK URL GAMBAR SOBAT DISINI" width="320" />

Demikian Artikel kali ini semoga bermanfaat bagi sobat blogger