Создаем "легкое" Sliding JavaScript меню

HTML-код  для меню будет довольно прост:

<div class="menu">
    <ul id="slider_menu">
        <li><a href="#">JavaScript</a></li>
        <li><a href="#">Graphic Design</a></li>
        <li><a href="#">HTML</a></li>
        <li value="1"><a href="#">User Interface</a></li>
        <li><a href="#">CSS</a></li>
    </ul>
    <div id="slide"></div>
</div>

В приведенном выше коде выделенное меню по умолчанию определено аттрибутом value= "1" на соответствующем пункте списка. Теперь нужно не забыть подключить стили и js-скрипт, которые "весит" всего лишь 1kb !

<link rel="stylesheet" type="text/css" href="menu_style.css" />
<script type="text/javascript" language="javascript" src="menu_script.js"></script>

Все что теперь нужно это просто вызвать следующую функцию:

<script type="text/javascript">menuSlider.init('slider_menu','slide'); </script>

Первая переменная - это id нашего списка <ul id="slider_menu">, вторая переменная - id "скользящего" блока <div id="slide">. Этот скрипт был протестирован в IE6, IE7, FireFox, Opera и Safari.