1

I've written this js so the menu is responsive but doesn't break when js is not enabled.

I have 2 menu lists each inside their own nav element. For tablet and mobile devices I want only a menu button (first item in the list with ) to show but no list until the menu button is pressed.

At the moment the first list hides on opening the page but the other list is permanently showing. However, clicking either menu button does the same job of showing the first list. Neither nav has an id or class.

Why is only one of the lists responding?

This is the JS (its in the head)

function showLists() {
$('.nav').show();
$(".menu").hide();
}
$(document).ready(function() {
if ($(window).width() < 450) {
    $('.nav').hide();
    $(".menu").click(function () {(
        showLists()
        )})
    }
});
4

1 に答える 1

0

基本的なトグル ナビゲーションを行っているかのように聞こえます。基本的な、さらに高度なレスポンシブ ソリューションの優れた出発点は、Brad Frost による RWD パターンです。

また、ほとんどすべてのソリューションで、ナビゲーション リストを 1 つだけ定義し、CSS と JS を使用してそれを操作し、応答性の高い動作にすることで解決できるはずです。

于 2014-02-10T04:15:48.460 に答える