Как сделать меню раздвижным ?!

Дата: Суббота, 04.06.2011, 22:05 | Сообщение # 1

Сообщений: 19

Замечания: ±

У меня есть меню. Мне надо сделать его развижным. Стили CSS ссылок и т.д. я пропишу сам. Мне надо сам код, что бы меню стало развижным. Заранее спасибо!

WinZeos

Дата: Суббота, 04.06.2011, 22:15 | Сообщение # 2

Сообщений: 78

[ 5 ]

Замечания: ±

Code

<a onclick="$('#menu1').slideToggle('slow');" href="javascript://;">Категория</a><br>
<div id="menu1" style="display:none">
<a href="#">Подкатегория меню</a><br>
<a href="#">Подкатегория мен </a><br>
</div>
   <a onclick="$('#menu2').slideToggle('slow');" href="javascript://;">Категория</a><br>
<div id="menu2" style="display:none">
<a href="#">Подкатегория меню</a><br>
<a href="#">Подкатегория меню</a><br>
</div>
   <a onclick="$('#menu3').slideToggle('slow');" href="javascript://;">Категория</a><br>
<div id="menu3" style="display:none">
<a href="#">Подкатегория меню</a><br>
<a href="#">Подкатегория меню</a><br>
</div>
   <a onclick="$('#menu4').slideToggle('slow');" href="javascript://;">Категория</a><br>
<div id="menu4" style="display:none">
<a href="#">Подкатегория меню</a><br>
<a href="#">Подкатегория меню</a><br>
</div>
   <a onclick="$('#menu5').slideToggle('slow');" href="javascript://;">Категория</a><br>
<div id="menu5" style="display:none">
<a href="#">Подкатегория меню</a><br>
<a href="#">Подкатегория меню</a><br>
</div>

Выглядит это так:
Категория

Категория

Категория

Категория

Категория

JaYFuNk

Дата: Суббота, 04.06.2011, 22:18 | Сообщение # 3

Сообщений: 19

[ 0 ]

Замечания: ±

WinZeos, нет, спасибо но не то. Меню горизонтальное... http://winskin.ru/ вот как тут в самом верху.

WinZeos

Дата: Суббота, 04.06.2011, 22:22 | Сообщение # 4

Сообщений: 78

[ 5 ]

Замечания: ±

JaYFuNk, На горизонтальном сам если честно не знаю.
На winskin.ru оно сделанно с помощью jQuery

JaYFuNk

Дата: Суббота, 04.06.2011, 22:23 | Сообщение # 5

Сообщений: 19

[ 0 ]

Замечания: ±

WinZeos, да я понял что на нем. Скачал с 10к менюшек развижных, и ничего не получаеться sad

Sezy

Дата: Воскресенье, 05.06.2011, 03:19 | Сообщение # 6

Сообщений: 38

[ 1 ]

Замечания: ±

JaYFuNk, Вот держи рабочее.

1) Скачай архив
2) Подключи нужные файлы (код ставь перед < /head >)

Code

3) Ставишь там где хочешь видеть меню:

Code

<div id="myslidemenu" class="jqueryslidemenu">
<ul>
<li><a href="http://forum-builders.ru">Пункт 1</a></li>
<li><a href="#">Пункт 2</a></li>
<li><a href="#">Папка 1</a>
      <ul>
      <li><a href="#">Подпункт 1.1</a></li>
      <li><a href="#">Подпункт 1.2</a></li>
      <li><a href="#">Подпункт 1.3</a></li>
      <li><a href="#">Подпункт 1.4</a></li>
      </ul>
</li>
<li><a href="#">Пункт 3</a></li>
<li><a href="#">Папка 2</a>
      <ul>
      <li><a href="#">Подпункт 2.1</a></li>
      <li><a href="#">Папка 2.1</a>
        <ul>
        <li><a href="#">Подпункт 2.1.1</a></li>
        <li><a href="#">Подпункт 2.1.2</a></li>
        <li><a href="#">Папка 3.1.1</a>
      <ul>
          <li><a href="#">Подпункт 3.1.1.1</a></li>
          <li><a href="#">Подпункт 3.1.1.2</a></li>
          <li><a href="#">Подпункт 3.1.1.3</a></li>
          <li><a href="#">Подпункт 3.1.1.4</a></li>
          <li><a href="#">Подпункт 3.1.1.5</a></li>
      </ul>
        </li>
        <li><a href="#">Подпункт 2.1.4</a></li>
        </ul>
      </li>
      </ul>
</li>
<li><a href="http://forum-builders.ru">Пункт 4</a></li>
</ul>
<br style="clear: left" />
</div>

Стиль меню полностью настраивается через CSS. В файле JS укажи полные ссылки к картинкам down.gif и right.gif

Прикрепления: jqueryslidemenu.rar (1.9 Kb)