Mungkin sebagian Blogger sering
melihat gambar yang menjadi besar apabila tersentuh cursor. Mungkin juga
ada yang kepingin dengan fitur tersebut. Dalam dunia blogging fitur
seperti ini sering disebut dengan namaImage Zoom Effects
atau Hover Zoom Smooth Effects. Fitur yang satu ini lumayan banyak di
senangi para blogger walaupun sebenarnya dengan memasang Image Zoom
Effects ini di blog dapat menggangu pengunjung yang sedang membaca
postingan kita.
Postingan ini saya buat untuk melengkapi Tutorial di blog ini, buat sobat yang ingin memasangnya silakan Anda ikuti tutorial dibawah ini. Udah gak sabaran ya? langsung ke inti aja
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 kode berikut tepat 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); }]]></b:skin> - Terakhir klik Simpan Template. Sekarang lihat hasilnya di blog Sobat.
- Contoh :
Semoga tutorial singkat ini bisa bermanfaat Sobat...
Kalo belum bisa tinggalkan komentar sob ok ?.......
Kalo belum bisa tinggalkan komentar sob ok ?.......
0 komentar:
Speak up your mind
Tell us what you're thinking... !