Показать сообщение отдельно
  #1 (permalink)  
Старый 30.10.2012, 02:59
Новичок на форуме
Отправить личное сообщение для notgosu Посмотреть профиль Найти все сообщения от notgosu
 
Регистрация: 30.10.2012
Сообщений: 4

Вертикальное меню - аккордеон. Проблема.
Доброго времени суток, ув. форумчане!
Заранее скажу, что с js я еще на "Вы", поэтому вопросы могут показаться глупыми.
Суть вопроса следующая. Есть меню в виде списка:
<ul class="dropdown dropdown-horizontal" id="yw1">
<li class="first"><a href="/">Каталог</a></li>
<li class=" dir"><a href="/about">О нас</a>
<ul>
<li class="first"><a href="/about/news">Новости</a></li>
<li><a href="/about/articles">Статьи</a></li>
<li class="last"><a href="/about/contact">Контакты</a></li>
</ul>
</li>
<li class=" dir"><a href="/cooperation">Сотрудничество</a>
<ul>
<li class="first"><a href="/cooperation/optovim">Оптовым клиентам</a></li>
<li><a href="/cooperation/supliers">Поставщикам</a></li>
<li><a href="/cooperation/proizvoditeli">Производители</a></li>
<li class="last"><a href="/cooperation/partners">Наши партнеры</a></li>
</ul>
</li>
<li class=" dir"><a href="/howtobuy">Как купить</a>
<ul>
<li class="first"><a href="/howtobuy/payment">Оплата</a></li>
<li><a href="/howtobuy/delivery">Доставка</a></li>
<li class="last"><a href="/howtobuy/refund">Возврат и обмен</a></li>
</ul>
</li>
<li class="last dir"><a href="/service">Cервис</a>
<ul>
<li class="first"><a href="/service/install">Установка</a></li>
<li><a href="/service/warranty">Гарантийное обслуживание</a></li>
<li class="last"><a href="/service/maintenance">Информация по уходу</a></li>
</ul>
</li>
</ul>

Как видно, элементы меню, имеющие вложенность имеют класс "dir". Задача - при клике на такие элементы сворачивать/разворачивать вложенную часть, но при этом не переходить по ссылке пункта меню.
Пробую с помощью JQuery cледующее:
$(document).ready(function() {
                                $("ul.dropdown li.dir a").click(function(){
                                    $(this).parent().find("li").slideToggle("slow");
                                    
                                });
                                });

При клике на элемент меню, вложенные элементы пытаются свернуться, но происходит переход по ссылке. Ссылки есть у каждого элемента и, к сожалению, их заменить на # нельзя.
Пробовал в скрипт после slideToggle("slow"); добавить:
return false;

При этом вложенное меню сворачивается/разворачивается но перейти по ссылкам вложенных элементов невозможно.

Подскажите, будь-те так добры, что добавить, чтобы можно было оперировать вложенными ссылками?
Заранее спасибо за ответы!
Ответить с цитированием