Sunday, June 26, 2011

Buat Image Hover Bulat Ketika Disentuh..

Okey.. kali nie adiela nak buat tuto untuk jawab pertanyaan seorang rakan blogger.. dia tanye camne nak buat image hover yang buat gambar jadi melengkung kalau disentuh..

Hek eleh.. bajet terer buat coding jeh ko adiela kan.. haha.. chupp.. chupp.. adiela Cuma nak share je apa apa ilmu yang adiela tau.. tak kan nak peram je sorang sorang kan.. share kan lagi baek, ada bawak faedah..
Dah.. mlalut..

PERINGATAN: klik CTRL+C untuk copy

Step 1:
Pergi “DESIGN”>>>>>”EDIT HTML”>>>>>tick “EXPAND EIDGET TEMPLATES

Step 2:
Cari code ini.. (klik CTRL+F)
/* Header

Step 3:
Paste kan code ini pulak diatas/sebelum code “/* Header” tadi..

/*------ IMAGE ANIMATION------*/img {filter:alpha(opacity=100);-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 40px #F6CEF5; -moz-box-shadow: 0px 0px 20px #FA58F4; -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: 2px solid#FA58F4; 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 #ff0080;padding: 0px;}

Korang tukarla yang kuning tu dengan code warna yang korang suka okey..

Chiaoo~



Makseh baca..suka? like okeyh and komen la :)

7 Comments:

Cik.Tedy said...

hehehhe..tq dielaa...=D

cik wiwiz said...

awk2.. mcm mana nak cari yg klik nie, yg keluar gajah cam awk nie? tp sy nak domo :D kat mana nak carik ek

Syahirah Suhaili said...

@cik wiwiz

hye cik wiwiz..hehe..adiela da sent code cursor domo kat shoutbox cik wiwiz..hehe :D

Muha Sz said...

thnkz...post lh lgk other tutorial keyh... =)

Syahirah Suhaili said...

@Muha Sz

hekhek..olrite..lak mek rajin2 mlah tuto gk ah.. :D

Urfi Luthfurrahman said...

thank you jangan lupa singgah urfie-blogs.blogspot.com clik gambar yg ada ayat Buku tamu

Related Posts Plugin for WordPress, Blogger...