Membuat Gambar Membesar Ketika Disentuh Cursor

Membuat Gambar Membesar Saat disentuh Cursor 

Mungkin sebagian Blogger sering melihat gambar yang menjadi besar apabila tersentuh cursor. Dalam dunia blogging fitur menyerupai ini sering disebut dengan nama Image Zoom Effects atau Hover Zoom Smooth Effects. Fitur yang satu ini tidak mengecewakan banyak di senangi para blogger walaupun bergotong-royong dengan memasang Image Zoom Effects ini di blog sanggup menggangu pengunjung yang sedang membaca postingan kita.

Postingan ini saya buat untuk melengkapi Tutorial di blog ini, buat sahabat yang ingin memasangnya silakan Anda ikuti tutorial dibawah ini.

gbr: http://www.ficripebriyana.com/

Cara Membuat Gambar Membesar Saat disentuh Cursor :

• Masuk ke akun blogger sobat.
• Pilih Template > Edit HTML.
• Ceklis / Centang Expand Widget Template.
• Cari kode ]]></b:skin> , gunakan fungsi Find dengan menekan tombol CTRL+F pada keyboard.
• Kalau sudah ketemu, letakkan arahan berikut sempurna 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); }
• Terakhir klik Simpan Template. Sekarang lihat akhirnya di blog Sobat.

Semoga tutorial singkat ini sanggup bermanfaat...

Sourche: WT

Advertisement

 

Baca juga:

Advertisement