saya akan membahas gimana cara buat effect gambar seperti di zoom..dalam hal ini Kita cuma tambahkan sedikit modifikasi di CSS.
Ok langsung saja saya akan berikan caranya :
- Login ke Blogger
- Pilih menu Tataletak lalu pilih edit HTML
- Cari kode berikut dengan Ctrl+F masukkan ]]></b:skin>
- Lalu paste kode dibawah ini, persis di atas ]]></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: 36px 12px;
-moz-border-radius: 36px / 12px;
-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}
Lihat yg warna BIRU,itu adalah kuran Effect zoom yg akan di tampilkan. silahkan Sobat edit dan sesuaikan dengan selera masing-masing. Setelah Selesai Lalu SAVE. Dan Selesai effect zoom gambar pada postingan sudah kamu bisa nikmati.
Post a Comment
W a r n i n g !
Komentar anda tidak boleh mengandung unsur:
- Penghinaan atau Pelecehan.
- Spamming (Spam Comment).
- Link Aktif atau Anchor Text, dan sejenisnya.
Komentar akan muncul setelah di setujui.
Tulislah setiap kata dengan penuh kesopanan.
Terima kasih untuk kunjungannya.