Tutorial : Image Hover


Assalamualaikum and annyeonghaseyo.Image hover ni untuk template designer.

1.Dashboard > Design > Edit HTML > Tick Expand Widget Templates
2.Press Ctrl + f serentak. cari code ni  /* Header
3.Copy code bawah ni
/*------ IMAGE ANIMATION------*/img, a img { border: 0px;  opacity: .75; filter: alpha(opacity=100); -o-transition: opacity 1.5s linear; -webkit-transition: opacity 1.5s linear; -moz-transition: opacity 1.5s linear; }img:hover, a:hover img {opacity: 100; filter: alpha(opacity=100); -o-transition: opacity 1s linear; -webkit-transition: opacity .8s linear; -moz-transition: opacity 1.5s linear; }
4.Paste dekat atas code /* Header
5.Preview & save.

9 comment [s]:

나야 Raihana said...

hehe...unnie,image hover tuh camne erk??..soalan bodo..hehe

Nurul Atiqah said...

@나야 Raihana: cuba saeng tgk pic dkt blog unnie ni, perasan x bila cursor sentuh pic tu dia akn jd terang . ha! tu la image hover . btw tu bkn soalan bodo pon . hehe . sekadar bertnye kn :D

나야 Raihana said...

hehe..thanx2..newbies nih mmg x pndai ckit..hehe..

JazzTJ said...

Thanks. x

Nurul AtiQah said...

@JazzTJ : Welcum :)

FazDi ♥ said...

Kak... Yg code /*Header tu tak de kat blog saya :o

FazDi ♥ said...

Dah jadi dah >.< Btw,Thanks

Nurul AtiQah said...

@FazDi : Kalau takde cuba cari code "head" then paste atas code tu :)

Zu imani said...

unnie..nk tanya.kalo sy nak adjust kdr slow warna asal tu boleh x ek?
mcm image dlm blog unnie ni perlahan sangat.sy nk terangkan sikit boleh ke ek?