Syaz Harzays Minme: Tutorial : Image Hover ( 360 Degree + Morph Effect )

Pages

STATUS UPDATED!
Assalamualaikum korang korang and korang... terima kasih kerana sudi singgah kat blog syaz ni.. hihihihi...

2 Jan 2014

Tutorial : Image Hover ( 360 Degree + Morph Effect )

Assalamualaikumm...

hyeppp korangggg...
syaz lagi kann.. hihihi.. takpaa.. asal syaz dapat kongsi tuto syaz at korang jaaa...
hope dapat bantu korang yang memerlukan tu...
tertanya-tanya macam mana image hover 360 degree plus morph effect?? oke3...
tengok gambar at bawahhh... kalau nak tau lebih lanjut..
try laaa tuto syaz ni yaa.. hihii.. 

SEBELUM

SELEPAS DISENTUH CURSOR


1. Log In --> Dashboard --> Template --> Edit Html..

2. Tekan F3, then search kod yang ni :

img {

dah jumpaa??

3. Copy kod yang dekat bawah ni pulak :

 -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
img:hover {
  border-radius: 50%;
  -webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);
}

4. Dah copy?? oke.. korang PASTE kat bawah kod yang korang search tadi..

5. PREVIEW dulu.. kalau dah puas hati n suka..  boleh SAVE laaa..

Kalau dah berjaya tu.. tolong syaz KLIK SINI ... hihi.. THANKSSS :) 

SELAMAT MENCUBA ^^

No comments:

Post a comment

Assalamualaikum...
alang-alang dah baca tu..
mintak tolong komen sekali boleh??
hehehehe ^^

Syaz Harzays Minme© . Designed by MaiGraphicDesign