Question

我已经构建了一个jquery响应式导航菜单。在需要时在移动视图中单击时，它会隐藏展开的列表项。但是在桌面视图中也隐藏它们（不想要）。我是jquery的新手。我尝试过enquire.js，但它似乎没有用。我知道它应该，但不确定我做错了什么。

我已经在这个论坛上查看了所有类似的问题，但似乎无法找到适合我的答案。我确信它是一个非常简单的几行，我无法在彻底搜索后找到它。这就是我遇到的（v.newbie）代码：＆lt; / p>

    $(function() {          
        var pull        = $('#pull');
            menu        = $('nav ul');
            menuHeight  = menu.height();

        $(pull).on('click', function(e) {
            e.preventDefault();
            menu.slideToggle();
        });

        $(window).resize(function(){
            var w = $(window).width();
            if(w > 510 && menu.is(':hidden')) {
                menu.removeAttr('style');
            }
        });
        $(".scroll").click(function(){
                $("nav ul").hide(1000);
            });
    });

我已经将我正在处理的内容上传到JSFiddle： http://jsfiddle.net/ConorMac/9qdd8784/

正如您所看到的那样，当断点低于510px时，它的行为方式与我希望它的行为方式相同。但是，我不能为我的生活获得超过510px的列表项目！任何帮助将不胜感激。和（非常基本的，我确定！）的经验教训。

干杯。

Answer 1

使用纯CSS - @media标记...

@media (max-width: 510px){
    ul{
        < styles go here >
    }
}

您应用于ul的任何样式仅适用于屏幕尺寸为510px或更低的情况。

如何禁用桌面视图的响应式移动菜单jquery命令

1 个答案: