Tutorial : Image Hover Effect 3

Sunday, December 09, 2012


Assalamualaikum

Hari ni dapat buat satu image hover baru lagi . yang ni takde sesiapa request . tadi bosan . so godek godek code dekat SINI . lepas tu jumpa image hover ni . macam ohsem . tapi taktau lah pada korang macam mana kan ? meh preview sikit :


LIVE PREVIEW


Amacam . terasa macam nak letak dekat blog korang tak ? haha . actually , this hover macam a little bit messy . tapi tak kesah lah sama ada ade yang nak pakai ke tidak .

For Classic Template :

Dashboard > Template 

Copy and Paste code bawah ni dekat ATAS </style>


img {
-moz-transition:1000ms;
-webkit-transition:1000ms;
}
img:hover {
-webkit-transform:skewY(360deg);
-webkit-transition:1000ms;
-moz-transition:1000ms;
}

Save and preview .

For Template Designer :

Dashboard > Template > Edit HTML

Copy and Paste code bawah ni dekat ATAS ]]></b:skin>


img {
-moz-transition:1000ms;
-webkit-transition:1000ms;
}
img:hover {
-webkit-transform:skewY(360deg);
-webkit-transition:1000ms;
-moz-transition:1000ms;
}

Save and Preview .

Ade orang request macam mana nak buat image hover macam aku pakai sebelum ni . nanti aku akan bagi next tutor okay ? :)

2 comments:

Template Designer. Full Edit by Hafiz Zulkafly. All Right Reserved.