Saturday, February 22, 2014

Membuat efek gambar hover shadow

Pada posting kali ini taukahbahwa.blogspot.com akan menyajikan posting tentang Membuat efek gambar hover shadow. Semoga dengan artikel Membuat efek gambar hover shadow akan menambah wacana untuk anda pembaca setia taukahbahwa.blogspot.com

Membuat efek gambar hover shadow

Untuk membuat efek gambar hover shadow aku akan menuliskan tutorialnya, kalau gambar disentuh cursor akan ada hover shadownya dan warnanya juga bisa diubah, caranya:

1.Dashboard > Template >edit HTML
2.Expand Template Widget dan tick F3 atau CTRL + F dan cari kode
 /*  Header
3.Letakkan kode di bawah ini tepat di atas kode tadi:
img {filter:alpha(opacity=100);
-webkit-transition-duration:3.5s;} img:hover {filter: alpha(opacity=70); opacity: .6; -webkit-box-shadow: 0px 0px 20px #FF44FF; -moz-box-shadow: 0px 0px 20px #FF44FF; -webkit-border-top-right-radius:30; -webkit-border-top-left-radius:30; -webkit-border-bottom-right-radius:30; -webkit-border-bottom-left-radius:30;}img:hover {filter: alpha(opacity=70); opacity: .70; border: 1px solid#FF44FF; border-radius: 50px; -moz-border-radius: 50px;}
-moz-opacity:1.0;
opacity:1.0;
}
img:hover {
filter:alpha(opacity=80);
-moz-opacity:0.80;
opacity:.80;
}
Yang aku tandai warna pink adalah kode warnya nya dan bisa diubah sendiri menurut warna kesukaan, setelah itu tekan pratinjau dulu baru simpan template.


Dapatkan berita terupdate dan unik setiap saat hanya di taukahbahwa.blogspot.com
Homepage|http://taukahbahwa.blogspot.com

No comments:

Post a Comment

jangan lupa tinggalkan komentar .... trimakasih atas kunjungannya