
После /head на нужных вам страницах вставляйте:
Код:
<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>
Далее залейте файлы из прикреплённого архива следующим образом:
jquery.sliding-menu.js - в папку js
Оставшиеся три картинки - в папку images
Скачать
Источник: apocalypse.ucoz.kz