Shadow Drop Hover Menu



Assalamualaikum awak awak awak. Rindu gila dengan blog. Terima kasih kerana sudi menjenguk!
Yura dah pun follow mereka yg follow Yura. Terima kasih sbb percaya kan Yura.

Ok, tangan ni asyik nak buat tuto sahaja. Ok jom buat sesama.
Just look at the menu below and try to hover it. Awesome right ?

Home About Tutorial Freebies Contact


  • Dashboard > Layout > Add a Gadget > HTML/Javascript 
  • Copy semua code di bawah dan paste kan ke dalam kotak HTML tersebut
<style>
@font-face{
font-family:candy;
src:url(http://static.tumblr.com/dep4vzc/f51mnejqs/candcu__.ttf);}
.menu {background:#FCDCE7;color:#94E1FF;padding:4px; font-family: candy;font-size:18px;-webkit-transition-duration:.80s;text-transform:uppercase;}
.menu:hover {box-shadow:inset 0 30px 0px #FCEDF2;color:#FF3377;text-shadow:0px 2px 0px #eee;border-bottom:25px double #FCDCE7;}
</style><center>
<a class="menu" href="LINK MENU">Home</a>
<a class="menu" href="LINK MENU"">About</a>
<a class="menu" href="LINK MENU"">Tutorial</a>
<a class="menu" href="LINK MENU">Freebies</a>
<a class="menu" href="LINK MENU">Contact</a></center>


  • Tukar kan code color kalau anda mahu. Dan boleh ambil code kat sini.
  • Lepas tu Save.
  • Digalakkan letak bawah header code ni untuk paparan yg lebih mantop ! :)

2 comments

  1. http://gamesyork.blogspot.com/

    ReplyDelete
  2. Singgah sini dan follow :) --> syazwanieafandi.blogspot.com

    ReplyDelete

Awak mehla komen? satu komen pun jadilah :')