Javascript.RU

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

Показать вложенный элемент меню
Добрый день! Есть небольшое меню-аккордеон.
HTML - разметка
<ul id="nav">
<li class="parent over"><a href="/category/santehnika"><span>Сантехника</span></a>
<ul>
<li class="empty"><a href="/category/fajns"><span>фаянс</span></a></li>
<li class="parent"><a href="/category/mixers"><span>Смесители</span></a>
<ul>
<li class="empty" <a href="/category/sink"><span>для раковины</span></a></li>
<li class="empty" ><a href="/category/bathroom"><span>для ванной</span></a></li>
<li class="empty" <a href="/category/shower"><span>для душа</span></a></li>
<li class="empty" ><a href="/category/kitchen"><span>для кухни</span></a></li>
<li class="last" ><a href="/category/bidet"><span>для биде</span></a></li>
</ul>
</li>
<li class="parent last"><a href="/category/bathaccessories"><span>Аксессуары для ванной</span></a>
<ul>
<li class="empty" ><a href="/category/holders"><span>держатели</span></a></li>
<li class="empty" ><a href="/category/hooks"><span>крючки</span></a></li>
<li class="empty" ><a href="/category/shelves"><span>полки</span></a></li>
<li class="empty"><a href="/category/glasses"><span>стаканы</span></a></li>
<li class="last" ><a href="/category/soapdishes"><span>мыльницы</span></a></li>
</ul>
</li>
</ul>
</li>

</ul>

Для вложенных меню(Смесители, Аксессуары для ванной) присваивается класс parent, для единичных элементов(фаянс) - класс empty.
При загрузке страницы сворачиваю меню(display:none для всех li):
$('ul#nav li.parent a').parent().find('li').css('display', 'none');

Навешиваю ивенты для вложенных меню:

$('ul#nav li.parent > a').click(
                                        function(){
                                            $(this).parent().find('li.parent').slideToggle('middle');
                                            return false;
                                        });
$('ul#nav li.parent ul li.parent > a').click(
                                        function(){
                                            $(this).parent().find('li').slideToggle('middle');
                                            return false;
                                        });


Но почему-то при клике по элементу "Сантехника" раскрываются только заголовки вложенных меню(Смесители и Аксессуары для ванной), а единичный элемент(фаянс) не отображается.
Подскажите, что добавить в код, чтобы отображать все вложенные меню, независимо от того, есть в них элементы или нету.
Вот тут пример http://jsfiddle.net/rQXuV/2/;
Заранее спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 31.10.2012, 16:05
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

Как вариант
<li class="parent empty" style="display: none; "><a href="/category/fajns"><span>фаянс</span></a></li>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Подсветка выделенного элемента меню ajax-сайта crayday AJAX и COMET 0 11.05.2012 12:25
Первый элемент меню не меняется(( stydent Элементы интерфейса 2 13.04.2012 23:01
Выпадающие меню like2dev Общие вопросы Javascript 9 21.10.2011 14:09
Проблема с аккордионом и меню Tie ExtJS 3 01.09.2011 14:36
Всплывающее меню (проблемы) Барин Элементы интерфейса 8 07.07.2011 09:22