Mungkin sebagian Blogger sering melihat gambar yang menjadi besar apabila tersentuh cursor. Dalam dunia blogging fitur seperti ini sering disebut dengan nama Image 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.
Bagi yang ingin membuat gambar di blognya membesar saat didekatkan dengan cursor, langsung saja disimak langkahnya dibawah ini..
- Masuk ke akun blogger sobat.
- Pilih Template > Edit HTML.
- Ceklis atau Centang Expand Widget Template.
- Cari kode ]]></b:skin> , untuk mempercepat pencarian gunakan fungsi Find dengan menekan tombol CTRL+F pada keyboard.
- Kemudian, letakkan kode (pada kotak paling bawah) tepat di atas kode ]]></b:skin>
- Terakhir klik Simpan Template . Sekarang lihat hasilnya di blog Sobat
.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); }
0 comments:
Post a Comment