™Galery™

/* ---------------
Animated Drop Down Menu with jQuery
---------------------------------- */
 ul, li .menu_head{
     margin:0; padding:0;
     list-style:none;
     }

.menu_head{
    border:1px solid #998675;
    }

.menu_body {
    display:none;
    width:184px;border-right:1px solid #998675;
    border-bottom:1px solid #998675;
    border-left:1px solid #998675;
    }
.menu_body li{
    background:#493e3b;
    }
.menu_body li.alt{
    background:#362f2d;
    }
.menu_body li a{
    color:#FFFFFF;
    text-decoration:none; padding:10px;
    display:block;
    }
.menu_body li a:hover{
    padding:15px 10px; font-weight:bold;
    }

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    $("ul.menu_body li:even").addClass("alt");
    $('img.menu_head').click(function () {
    $('ul.menu_body').slideToggle('medium');
    });
    $('ul.menu_body li a').mouseover(function () {
    $(this).animate({ fontSize: "14px", paddingLeft: "20px" }, 50 );
    });
    $('ul.menu_body li a').mouseout(function () {
    $(this).animate({ fontSize: "12px", paddingLeft: "10px" }, 50 );
    });
});
</script>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgL4xI6Rv2FsekJwhDLMZBeqDHc59lpzBY2O-F6hOiHrJMyBHAxV0vvT8JkjEpvPeY_5g0shKY9saQcpGK8RElSc42hGT32aKwg3DVny4jvutnWsnmnCnPE-FdB3gkS-uvEmTK-HAPUjL0/s1600/navigate.png" width="184" height="32" class="menu_head" />
<ul class="menu_body">
<li><a href="#">About Us</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Clients</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Support Forums</a></li>
<li><a href="#">Gallery</a></li>
<li><a href="#">Contact Us</a></li>
</ul>