Question

我使用jquery创建了一个响应式移动菜单。除了切换菜单外，一切正常。默认情况下，菜单会展开。我希望默认情况下折叠菜单，当单击单词菜单时，它会展开，然后可以在选择时展开和折叠。这里唯一需要考虑的是，还有一个普通的导航菜单，它以不同的方式显示和布局。我希望这个菜单始终有效。我只希望默认情况下隐藏（折叠）移动菜单，然后在点击时展开。

我已将投影上传到jsfiddle：link http://jsfiddle.net/qdhg0r9d/

谢谢

Answer 1

添加

@media screen and (max-width: 600px) {    
#collapse-menu{
    display:none;
    }
}

对于你的CSS，当屏幕宽度小于600px时，默认会隐藏它，然后当你单击切换时，jQuery将通过添加内联样式display:block;来覆盖它并再次显示

Answer 2

$(document).ready(function () {
    if($(window).width() <= 640){
        $("#collapse-menu").toggle();
        $("#pull").on('click',function () {
            $("#collapse-menu").toggle();
        });   
    }
});

它只能根据屏幕宽度

运行

移动菜单 - 扩展和折叠

2 个答案: