Адаптивный дизайн, отображение статического списка в раскрывающемся списке в мобильном представлении

Question

Адаптивный дизайн, отображение статического списка в раскрывающемся списке в мобильном представлении

0

У меня есть статический список таких элементов:

<div id="accordian">
    <ul>
        <li class="active">
            <p class="accordiontitle_two"><a href="/">Women Clothing</a></p>
            <ul>
                <li><a href="/women-coats/">Coats</a></li>
                <li><a href="/women-dresses/">Dresses</a></li>
                <li><a href="/women-jackets/">Jackets</a></li>
                <li><a href="/women-jeans/">Jeans</a></li>
            </ul>
        </li>
    </ul>
</div>

Я хочу показать это в раскрывающемся списке, если ширина экрана падает ниже определенной ширины, например, в мобильных браузерах. В настоящее время я использую свойство экрана @media в CSS, но я предполагаю, что что-то вроде этого требует jquery?

Мой вопрос: как мне добиться чего-то подобного?

Спасибо

user2028856 09 нояб. 2013, в 18:22

Источник

Теги:

jquery

css

mobile

1 ответ

Ещё вопросы

andershagbard · Accepted Answer · 2013-11-09T15-34-00.000Z

Предположим, у вас есть кнопка, которую вы скрываете в разрешениях экрана более 520 пикселей.

$("button").click(function() {
      $("#accordian ul").toggle();
});

Когда вы нажмете, он переключит все ваши элементы ul внутри #accordian.