interactive navigation bar

This navigation can be made with some CC3 animations and Javascript (jQuery). What help specific do you need?

how to create it from scratch. heres the code i already have:

<div id="MenuContainer">
        <ul id="navigation">
            <li class="Home"><a title="Home" href="index.html" >Home</a></li>
            <li class="x"><a title="About" href="#" >About</a></li>
            <li class="x"><a title="Portfolio" href="#" >Portfolio</a></li>
            <li class="x"><a title="CV" href="#" >CV</a></li>
            <li class="x"><a title="Contact" href="#" >Contact</a></li>
        </ul>
    </div> 

.MenuContainer {
    height: 55px;
    width: 100%;
    bottom:0;
}
ul#navigation {
    height: 55px;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
    background-color: #000;  
    text-align: center;

    font-size: 16px;
    font-family: 'Cham-WebFont', Arial, sans-serif;
    position: fixed;
    bottom: 0;
}
ul#navigation li {
    display: inline;
    margin-right: .75em;
    list-style: none;
    margin: 5px;
    padding: 5px;
    color: #47B35B;
}
ul#navigation li.last {
    margin-right: 0;
}

I'm not going to do your homework for you ;) but here is a quick and dirty example to point you in direction you're aiming for:-

http://jsbin.com/kofojuni/1/

I believe all the effects of his menu can be done with CSS. It would be well worth exploring the CSS classes here to get an idea of how you might like to implement the effects.

To make that the site is never reloading but simply moving to other sections, you need to have all the code in 1 page. So, the navigation links needs to link to that sections on the page. If you want some cool animations you can't use simple links to do that, but you need to use some jQuery.

I've made an example: http://web.dfw3qc8i5d.treehouse-app.com/

This is the basic, and than you can animate the buttons, like Richard is doing it.

thanks guys, I was thinking of using images as the buttons! is this possible in a nav?

thanks and no what is SVG? I have decided how i want it to look. In the bottom left hand corner of the navbar i want a button containing an image which will be animated. The animation will simply have ripples round it to draw the users attention. When the button is hovered over, a menu will appear displaying "about" "portfolio" "cv" and "contact". When the button is clicked i want it to go back to the home page. Any ideas on how to achieve this idea? i know I'm being lazy but i don't know what to search for.

thanks