MEMBERI EFEK ZOOM PADA GAMBAR POSTING BLOG
Dalam posting ini saya ingin membagikan trik sederhana tentang cara memberi atau memasang efek zoom pada gambar yang ada diposting blog dan untuk lebih jelasnya silahkan lihat demonya dibawah ini :
Pertama Rancangan>EditHTML>CTRL+F>masukkan kode
]]></b:skin>
Nah untuk pemasangannya silahkan tambahkan kode dibawah ini sebelum kode
]]></b:skin>
.post img{
-webkit-transform:scale(0.7); /*Webkit 0.7 times the original Image size*/
-moz-transform:scale(0.7); /*Mozilla 0.7 times the original Image size*/
-o-transform:scale(0.7); /*Opera 0.7 times the original Image size*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla Animation duration*/
-o-transition-duration: 0.5s; /*Opera Animation duration*/
opacity: 0.5;
margin: 0 10px 5px 0;
}
.post img:hover{
-webkit-transform:scale(1.1); /*Webkit: 0.5 times the original Image size*/
-moz-transform:scale(1.1); /*Mozilla 0.5 times the original Image size*/
-o-transform:scale(1.1); /*Opera 0.5 times the original Image size*/
box-shadow:0px 0px 30px gray;
-webkit-box-shadow:0px 0px 30px gray;
-moz-box-shadow:0px 0px 30px gray;
opacity: 1;
}
