Round Image Hover // Tuesday, November 8, 2011
Assalamu'alaikum...
*gambar tiada kaitan
Hari ini Lettha mau update tutorial lagi lhooo :D *bangga* tutorial ini direquest oleh:
Ya, Lettha tau apa maksud-nya :) maaf ya tapi Lettha nggak punya printscreen nan nya, so nggak bisa jelasin gimana tutorial ini.
Daripada Lettha jelasin panjang lebar disini, terus nanti ada kata kata yang salah and mengundang HATTERS karena dikira Lettha SOMBONG. So, lebih baik diam. Silent is a Gold.
Caranya:
Dashboard >>Design >>Edit HTML
Cari kode:
/* Header
Pastekan kode ini diatasnya;
*------ IMAGE HOVER ROUND------*/
img {filter:alpha(opacity=100);-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 20px #000000; -moz-box-shadow: 0px 0px 20px #000000; -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=60); opacity: .60; border: 1px solid#000000; 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;}u {text-decoration:underline;border-bottom: 2px dotted #FFFFFF;padding: 0px;}
- Merah itu warna round nya.
- Pinky itu warna bordernya, ganti pakai: dotted atau solid atau dashed atau inset atau outset
PREVIEW DULU !!! Kalau puas, click Save Tempelate :)
Hatter jangan pakai tutorial ini ya? Pakai juga nggak apa apa karma masih berlaku kok ^_^