Sabtu, 30 Maret 2013

Membuat zoom otomatis untuk Gambar pada Blog

Ketika cursor di letakkan tepat pada gambar, maka dengan otomatis gambar tersebut menjadi sedikit lebih besar dari tampilan normal. Hal tersebut menjadi keunikan tersendiri untuk tampilan blog kita. Kali ini TCM coba berbagi tips unik membuat zoom otomatis untuk gambar pada blog.
  • Login akun blogger
  • Masuk ke Template
  • Edit HTML
  • Copy paste  kode berikut tepat berada di atas kode ]]></b:skin>   
.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); }

  • Simpan templete 

Tidak ada komentar: