Tutorial : Header Hover - Right/Left

Assalamualaikum . Hello people . :)


Okey . Today Miss M nak buat satu tutorial , dimana bila korang halakan cursor korang tu dkat header , header tu akan bergerak ke kanan ataupun ke kiri .


Okey . Lets start !


Dashboard > Design > Edit HTML > Tick Expand Widget Templates .

Cari code yang sama macam code kt bawah nie . Korang boleh cari guna Ctrl+F atau F3

h1.title {

ATAU

#header h1 {

Copy code nie dan paste kat ATAS code tersebut .

#header:hover {padding-right: 50px;-webkit-transition-duration: 0.5s;}

 Preview dulu , if nothing error, save jelaa .

Notes:

     : Boleh ubah, either left or right . 

     : Korang boleh tukar 10 , 20 and ......

     : Kalau nak lambatkan , boleh tukarkan ke 1 , 2, 3, .....


* Kalau tak jumpa cari code tu, cuba cari code nie pulak :

#header {

ATAU

/* Header 

 Then, korang pastekan code yang Miss M bagi tu kat BAWAH code tersebut .

SELAMAT MENCUBA !