Sunday 12 July 2015

Tutorial : Header Hover 3 ( Ghaib! )


Helloo. So harini pulak Nua buat tuto header hover yg ketiga. Header ni bila cursor korg halakan dkt header, nnti header tu hilang tiba2! Ush gempak gila kan. Nak try? Meh sini.

TEMPLATE DESIGNER BLOG
 
1) Template > Edit HTML > Proceed.
2) Tekan CTRL+F/F3, search code :
   h1.title {
or
#header h1 {
3) Copy code dibawah dan paste di Atas code tu 
#header:hover {
padding-left:160px;
-webkit-transition: 2.5s;
-webkit-transform: rotate(6deg);
opacity:.01;
}
4) Preview. Takda error baru save.

NOTES
Red : Boleh pilih rotate ke right / left
Blue : Kalau rasa tak sesuai boleh tukar.
Green : Kalau nak slowkan tambah la jadi 3 ke apa ke. Sukati korg la
Orange : Ubah sendiri kalau rasa tk sesuai hehe.

Kalau sapa yang tak jumpa code code di atas tu. Boleh try search code ni :
#header {
or
/* Header
Then korg paste dekat bawah code yang Nua bagi tadi.

FOR SIMPLE TEMPLATE/TEMPLATE DESIGNER yang tak jumpa code, boleh search code ni :
/* Content 
dan paste code yang Nua bagi mula2 tadi tu di Atas code yg korg cari.

Goodluck! :D