membuat efek membesar saat tersentu cursor pada gambar postingan

 Sobat pernah lihat gambar di artikel menjadi membesar ketika tersentu cursor, Dalam dunia blogging fitur seperti ini sering di jumpai dan disebut juga dengan nama Image Zoom Effects atau Hover Zoom Smooth Effects. fitus sepererti Hover Zoom Smooth Effects ini emang lumayang di minati sob para logger mahir dan pemulaseperti saya ini.





ok sob langsung ajah masuk ke langkah-langakah pembuatannya:

1. masuk ke blogger sobat
2. pilih template=> edit HTML
3. cari kode ]]></b:skin> biar lebih cepat dalam pencarian tekan CTRL+F pada keyboard
4.  truss, copy code dibawa :

post img, table.tr-caption-container { border:none; max-width:560px; 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); }

  5. paste kode yang barusang di copy tepat di atas ]]></b:skin>
  6. tugas terakhir, klik simpan
  7. buka blog sobat dan coba lihat hasilnya  

Tweet