Навигация по JQuery для скольжения по списку

0

Кажется, я не могу работать, но я не понимаю, почему. Может кто-то быстро взглянуть и сказать мне, что я делаю неправильно?

Цель: я хочу, чтобы мой "sidebar-inner-list" скользил вниз, когда я нажимаю "sidebar-navigation> li", и я хочу, чтобы закрыть все открытые списки, когда я нажимаю закрытую. Мне также нужно иметь возможность закрыть тот, который я нажал, когда я снова нажму его.

HTML

<ul class="sidebar-navigation">
            <li>
                Overskrift
                <ul class="sidebar-inner-list">
                    <li>
                        <a href="#">Link</a>
                    </li>
                    <li>
                        <a href="#">Link</a>
                    </li>
                </ul>
            </li>

            <li>
                Overskrift 2
                <ul class="sidebar-inner-list">
                    <li>
                        <a href="#">Link 2</a>
                    </li>
                    <li>
                        <a href="#">Link 2</a>
                    </li>
                    <li>
                        <a href="#">Link 2</a>
                    </li>
                </ul>
            </li>

        </ul>

Jquery

var allPanels = $('.sidebar-inner-list > li').hide();

$('.sidebar-navigation > li').click(function () {
    allPanels.slideUp();
    $(this).children('.sidebar-inner-list').slideDown();
    return false;
});

Надеюсь, кто-то может заметить ошибку.

я также сделал скрипку: http://jsfiddle.net/iBertel/nrFhu/6/

  • 0
    Я бы использовал slideToggole () вместо
Теги:
slide

2 ответа

1
Лучший ответ

Вам нужно свернуть те же элементы, которые вы скрываете.

http://jsfiddle.net/isherwood/nrFhu/7/

$(this).find('.sidebar-inner-list').slideDown();

Должно быть

$(this).find('.sidebar-inner-list li').slideDown();

Чтобы решить проблему с обновлением, вам, вероятно, потребуется добавить еще один логический уровень:

http://jsfiddle.net/isherwood/nrFhu/8/

$('.sidebar-navigation > li').each(function () {
    $(this).click(function () {
        $('.sidebar-navigation > li').not(this).find('li').slideUp();
        $(this).find('.sidebar-inner-list li').slideDown();
        return false;
    });
});
  • 0
    Потрясающие! Если у вас есть время, как бы вы справились с проблемой, что я не могу закрыть открытый список без его повторного открытия? Вы получите правильный ответ, несмотря ни на что.
  • 0
    Работаю над этим....
Показать ещё 1 комментарий
0

Попробуй это

$(document).ready(function(){
    $('.sidebar-inner-list').children("li").slideUp(0);
    $('.sidebar-navigation li').click(function () {
        $('.sidebar-inner-list').children("li").slideUp();
        $(this).children(".sidebar-inner-list").children("li").slideDown();
    });
});

Ещё вопросы

Сообщество Overcoder
Наверх
Меню