Tutorial Image Hover

tuto lagi

direquestkan oleh Ariff lagi di facebook message

*aku rase yang dye maksudkan image hover lah kot*

bagi korang yang tak tau ape tu image hover 

image hover ialah bile cursor pegy kat ape2 picture

picture tu akan jd cam kabur ckit n tepi2 picture is like a shadow

kalau nak lebih pasti , gerakkan cursor korang ke picture yg ada lam blog zaty nim

oke , dah nampak ? tu lah image hover

nk buat ? jom !

follow below steps :

1. Dashboard > Design > Edit HTML

2. Cari code bawah nim ( utk memudahkan pencarian tekan Ctrl+F / F3 )

/* Header

3. Lepas dah jumpe copy code di bawah nim dan pastekan di atas code /* Header

--------------
/*------ IMAGE ANIMATION------*/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 #ff0080;padding: 0px;}

-------------------

4. #000000 = yang tu untuk colour shadow dye , korang boleh tukar mengikut colour kegemaran korang . colour2 tersebut boleh didapati di >SINI<
5. Preview dulu oke ? kalau dah jadi Save la ek .. tak paham sile rujuk Zaty lagi .. bubbye ^^

---

♥ Terima kasih sudi baca. Like and comment la sekali. ♥

---