.
“Kita berdakwah, orang meludah. Kita tarbiyah, orang menyampah. Jangan mengalah. Kita seorang khalifah & kita ada Allah.”
Related Posts Plugin for WordPress, Blogger...

24 December 2012

Tutorial : navigation Like me

Assalamualaikum. Mak tengah tengok cite merlin. I nak tengok Pramlee. Tapi mak sibuk nak tengok merlin. Mak moden, Anak kampung. Lols haha... So, izzah nak buat tutor pasal navi style baru, Ade yg request~
Izzah ade buat live preview. Sebab izzah pun seorang blogger. Susah kan,kalau tak buat live preview sebab kite tak tahu navi ni macam mane jenis. So, izzah ade sediakan live preview untuk kesenangan korang. Biarpun izzah menderite nak kene print screen, Lols. Haha. Tak susah pun. Jom -SSttAArrDD-

LIVE PREVIEW :

1- Blogger > Dashboard > Layout > Add A Gadget > HTML/JavaScript
2. Copy codes ni dan pastekan kat ruangan HTML/JavaScript


<style>a.nav{-webkit-transition: 1.0s;-moz-transition: 1.0s;margin:5px;display:inline-block;text-align:center;background: #eee;color:#000;width:90px;padding:4px;font: 13px Franklin Gothic Demi Cond;}
a.nav:hover{color: #fff;background:  #EBD6FF;-moz-box-shadow: inset 0 0 5px 5px #EBD6FF;-webkit-box-shadow: inset 0 0 30px 30px #EBD6FF;box-shadow: inset 0 0 30px 30px #EBD6FF;}</style>
<div style="background: #CAC7D9; border-bottom: 1px dashed #fff; border-top: 1px dashed #fff;"/><center><a class="nav" href="URL/LINK">PERKATAAN</a><a class="nav" href="URL/LINK">PERKATAAN</a><a class="nav" href="URL/LINK">PERKATAAN</a><a class="nav" href="URL/LINK">PERKATAAN</a></center></div>

 3. Save

Color : Tukarkan kepada background korang ye. yang ni background yang kat belakang tu. bukan background tab menu.tukarkan kepada color codes anda. boleh cari kat SINI
Color : Ni baru background menu. tukarkan kepada color codes anda. boleh cari kat SINI

Kalau nak tambah lagi, letak ni

<a class="nav" href="URL/LINK">PERKATAAN</a>

NOTA KAKI
Sebenarnya boleh nak tukar hover semua tu. Tapi susah nak ajar. Korang pandai pandai la adjust yew. Yang code code yg ade '#' tu mungkin code hover. so, pandai pandai korang lah yew.. kalau jadi, Comment. Kalau ade pertanyaan. Tanye kat komen jugak..

Satu lagi, Meh tengok vlog baru izzah kat Youtube. TEKAN SINI . Korang tekan la channel tu. Dan tengok video-video sebelumnyeww. Okay? . Bai..~

4 comments:

Fara Tasya said...

Hai, mcm tahu jer dari mana dpt info tu. hahaa. info yg berhabuk dalam blog sy digunapakai balik. dibuat video pulak tu. OH! bangga!

IZZAH!! TQ sbb wak tuto nie. lama jaman oh carik tuto nie dop jupe2. muehehe!! tq frens

hi said...

Hai, Hahaha. Lama jaman doh ke cari? Bkpe dop tanyew saya..~ Hahaha.

Ashjbxoxo said...

Assalammualaikum ! Hi ! saya pakai tuto awak.
Terima kasih daun keladi,
nak tahu? menjadi, Hee :D

hi said...

Waalaikumussalam. Hee :D Thanks sbb dah gune.