Wednesday, November 16, 2011

TUTORIAL : HEADER HOVER -GHAIB!-

Hye guys! 1st time wat tutorial. Credit to Amalina sbb wat tuto neh. Ummu try wat tp bg ummu nice la tp ummu dlete blek sbb na header ummu just simple :). Btw, smart pulak header jadi macam tu. Ala, header bile korang gerakkn cursor dkt header, header tu akn ghaib. ^.^ Oh ye, kalau tak jadi, maaf la ye. Maybe hanya sesuai untuk Template Denim ;). Now, lets we start:

1.Dashboard > Design > Edit HTML.
2.Tekan CTRL+F/F3, search for this code :
h1.title {
3.Copy code ni dan pastekan kat ATAS code tu :
#Header:hover {
padding-left:160px;
-webkit-transition: 2.5s;
-webkit-transform: rotate(6deg);
opacity:.01;
}
Preview dulu, kalau takda error, korang boleh save.

NOTES :
left : You can choose either right or left.
160 : Kalau rasa tak sesuai, tukar je lah.
2.5 : Kalau nak slowkan, tambahkan jadi 3 and so on.
(6deg) : Ubah la sendiri kalau rasa buruk, haha.
Rasanya tak payah nak edit apa-apa, hanya memeningkan kepala je.


#UPDATED!
Memandangkan ramai tak jumpa code, cubalah cari code ni :
#header { atau /* Header
. Then, korang paste code yang Ummu bagi tu di
bawah
code tersebut.




Haa, you see it? Kotak yang dimerahkan tu merupakan code header hover korang. Pastikan korang letak code di tempat yang betul berdasarkan gambar di atas. Erk, kalau tak jumpa code atau tak jadi, pasrah je lah, hihi. Try an error dear :)

#ANOTHER WAYS!
FOR TEMPLATE DESIGNER, try search code ni :
.footer-outer{display:none;}
dan pastekan code
header hover di bawahnya




.

4 0 sedang membebel:

Azlan Hasan said...

owh..cenggitu rupanya...hehehe

Regards,
-Strider-

cik ummu oag ツ said...

@Azlan Hasan cm tu laa.. hehe. try la buat :)

Woofer Storm said...

segan pula nak guna toturial ni..hehehe


follow sini^^

cik ummu oag ツ said...

@Woofer Storm segan nape plak? haha. guna je. btw, thanks :)