Toturial: Navigation with Hover #1

TITLETITLETITLETITLE

Assalammualaikum. 

Pagi ini aku berbesar hati nak kongsikan dengan korang satu lagi toturial. Aku nak ajar korang buat Navigation with Hover. Hope korang enjoy.

1) Layout > Add a gadget > Edit Html/Javascript

2) Copy code di bawah. 

<style>
.nav a{
background:#eee;
display:inline-block;
width:105px;
font:10px trebuchet ms;
margin:5px;
border:1px solid #e6e6e6;
text-align:center;
color:#858585;
text-decoration:none;
text-transform:uppercase;
letter-spacing:1px;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
-o-transition: all 0.6s ease-in-out;
transition: all 0.6s ease-in-out;
}
.nav a:hover {
border-radius:10px;
box-shadow: inset 60px 8px 0px 0px #000, inset -60px -8px 0px 0px #000;
color:#fff;
}
</style>

<div class="nav">
<div style="text-align: center;">
<a href="PASTE YOUR LINK HERE">TITLE</a><a href="PASTE YOUR LINK HERE">LINK</a><a href="PASTE YOUR LINK HERE">TITLE</a><a href="PASTE YOUR LINK HERE">TITLE</a><a href="PASTE YOUR LINK HERE">TITLE</a><a href="PASTE YOUR LINK HERE">TITLE</a>
</div>
</div>

3) Pastekan diruang html/javascript tadi.

4) Save.

*warna merah tu, sila tukar ye.