После /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