Tutorial : Header Hover - Sparkle

7:30:00 AM


Assalamualaikum and hello korang. Wassup ? Iman sihat ? XD 

So, kali ni fafa nak buat tutorial tentang sparkle header hover. Maksudnya header korang sebelum dihalakan cursor, tetap biasa. Then, bila dihalakan cursor, the header will got something sparkle. Faham ? Mohon anak-anak murid cikgu mudah faham XD

  • Classic template : letak code kat bawah ni kat atas code </style> 
  • Template designer : letak code kat bawah ni kat atas code /* Header

Pengguna classic template 

1. Dashboard > Template
2. Tekan CTRL+F dan cari code </style> 
3. Copy code dibawah ni. Dan paste diatas code yang korang cari tadi.

Pengguna template designer 

1. Dashboard > Template > Edit html
2. Tekan CTRL+F then, cari code /*Header.
3. Copy code dibawah ni. Dan paste diatas code yang korang cari tadi.

img{
cursor:vertical-text;
opacity:1.0;
}
img:hover{
background: url(http://a.deviantart.net/avatars/s/p/sparklesplz.gif?1);
opacity:1.0;
cursor:vertical-text;
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
-o-transition:All 1s ease;
}

4. Save.

NOTA KAKI TANGAN :
  • Sparkle ni warna putih so dia takkan ada pada image selain header contohnya body blog sebab biasanya body blog ni warna putih je. Mohon faham.
 
Korang boleh request apa-apa di ask.fm tau XD

Assalamualaikum
Blog Author : Fafa Kyraa

You Might Also Like

0 Commentor(s)

Assalamualaikum
Feel free to put your thoughts here XD