girlwithbighead
  Tutorial : Navigation (iii)  
12/09/2012 | 5 comments

My own coding, don't re-post.

Preview :
Click here to see live preview

Template Designer : Paste dekat Html/Javascript
Blogskins : Paste dekat bawah </style>
<style>
.navv1 {left: 420px;}
.navv2 {left: 530px;}
.navv3 {left: 640px;}
.navv4 {left: 750px;}
.navv1, .navv2, .navv3, .navv4{
border-radius: 40px 0px 40px 0px;
-moz-border-radius: 40px 0px 40px 0px;
-webkit-border-radius: 40px 0px 40px 0px;
-webkit-transition: 1.0s;
top: 20px;
-moz-transition: 1.0s;
margin:1px;position:FIXED;
display:inline-block;
text-align:center;
background: #E0FFA3;
color:#000;
width:100px;
padding:8px 2px 8px 2px;
overflow: hidden;}
.navv1:hover, .navv2:hover, .navv3:hover, .navv4:hover{
border-radius: 0px 40px 0px 40px;
-moz-border-radius: 0px 40px 0px 40px;
-webkit-border-radius: 0px 40px 0px 40px;
top: 300px;
background: #aaa;
color:#222;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;-o-transition: all 1s ease;
transition: all 1s ease-in-out;}</style>
<center>
<a href="link"><div class="navv1">Tutorial</div></a>
<a href="link"><div class="navv2">Freebies</div></a>
<a href="link"><div class="navv3">Entries</div></a>
<a href="link"><div class="navv4">Affiliates</div></a>
</center>


OLDERNEWER