Rolling Menu

User Rating: / 0
PoorBest 

Today i will present you rolling menu based on HTML, CSS and Jquery. It is a rollin menu, this means that when mouse is over the background is rolling to the top.

In the HEAD section you must link css and jquery with HTML:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />

Now let's create the html buttons:

<div class="bodyMenu">
<ul id="nav">
    <li><a href="#">HOME</a></li>
    <li><a href="#">ABOUT US</a></li>
    <li><a href="#">SERVICES</a></li>
    <li><a href="#">GALLERY</a></li>
    <li><a href="#">CONTACT</a></li>               
</ul>
</div>

Also in the body section put the script:

<script src="js/jquery.flipNav.js" type="text/javascript"></script>
<script type="text/javascript">
    $('#nav').flipNav();
</script>