Tutorial : Navigation hover #1

Bisbillahirahmanirahim...
Assalamualaikum dan Salam Sejahtera~

Hari ni Fara nak cepat so sempat buat tuto ni je~
ok kalau korang suka style tu korang buat lah!

                        [ LIVE PREVIEW]


Facebook Fara meh! Lukis-lukis~

ok kalau nk jom ikut tuto ni~

1.Sign in => Dashboard => layout => add gadget => html/java script

2.Copy code kat bawah ni dan paste kan pada ruang html/java script

<center>
<style type="text/css">
a.navoo{
box-shadow: inset 9px 0 0px 0 #222;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
margin:1px;
display:inline-block;
text-align:center;
background: #fff;
color:#000;
width:100px;
border:1px solid #aaa;
border-left:20px solid #E6B8E6;
width: 100px;
overflow: hidden; }
a.navoo:hover{
box-shadow: inset 850px 0 0px 0 #FFD6FF;
color: #555;}
</style>
<a class="navoo" href="https://www.facebook.com/FaranymShdwFangBoboiboy">Facebook</a>
<a class="navoo" href="http://faranymboboiboy.blogspot.com/p/about-me.html">Fara meh!</a>
<a class="navoo" href="http://faranymboboiboy.blogspot.com/2013/01/art-trade.html">Lukis-lukis~</a>
</div>

* ok, warna merah tu korang tukar dengan warna kegemaran korang. Korang boleh ambil code warna di sini :) [ HTML Color Picker ]
* korang andai-pandai la tukar link dan title erk? senang je kan?
*kalau korang nak tambah lagi navi korang kena tambah kod ni bawah
<a class="navoo" href="http://faranymboboiboy.blogspot.com/2013/01/art-trade.html">Lukis-lukis~</a>

<a class="navoo"  link "> title </a>

ha, senang kan? ok lah Bye assalamualaikum dan semoga berjaya!