<script type="text/javascript" src="/js/jquery.sliding-menu.js"></script>
  <script type="text/javascript">
  jQuery(function(){  
jQuery('#HorizontalSlidingMenu .SlidingMenu').slidingMenu();  
  });  
  </script>  
  <style>  
  body {  
font-family: "Arial","Verdana","Helvetica";  
font-size: 0.9em;  
margin: 1.5em;  
  }  
  ul.SlidingMenu {  
list-style: none;  
padding: 0em;  
  }  
  ul.SlidingMenu a {  
padding: 0.62em 1.5em;  
text-decoration: none;  
color: #FFF;  
outline: none;  
  }  
  ul.Horizontal li {  
float: left;  
  }  
  .ClearFix {  
clear: both;  
  }  
  #HorizontalSlidingMenu {  
background: url('/images/menubg.png') top left repeat-x;  
  }  
  #HorizontalSlidingMenu li.Background {  
background: url('/images/bg_menu_right.png') top right no-repeat;  
  }  
  #HorizontalSlidingMenu li.Background div{  
background: url('/images/bg_menu.png') top left no-repeat;  
height: 100%;  
margin-right: 31px;  
  }  
  </style>

<div id="HorizontalSlidingMenu">
<ul class="SlidingMenu Horizontal">
<li><a href="#">Первый пункт</a></li>
<li><a href="#">Второй пункт</a></li>
<li><a href="#">Третий пункт</a></li>
<li><a href="#">Четвёртый пункт</a></li>
<li><a href="#">Пятый пункть</a></li>
</ul>
<div class="ClearFix"></div>
</div>