调整窗口宽度时隐藏菜单

Question

我想在窗口宽度大于479px的时候去掉topMenu。

这是代码，我使用了 .hide 和 .css('display','none') 甚至 .slideToggle(false)，但它不起作用。 CSS 中的默认设置是 display:none。

当窗口小于 479 像素并带有单击事件时，会出现 slideToggle 菜单，然后，当窗口大于 479 像素时，我需要停止该功能，因为我有另一个用于更宽窗口的菜单，该菜单与相同的单击事件一起出现.

我无法在更宽的窗口中消失或消除该功能。

    $(window).on('resize', function(event){
    var windowSize = $(window).width(); 
    if(windowSize > 479){
        $('#topMenu2').hide();

    } 
});

有什么想法吗？

Answer 1

CSS 解决方案怎么样？

@media screen and (min-width: 479px) {
    #topMenu2 {display: none}
}

Answer 2

改用 CSS：

@media screen and (max-width: 479px)
{
    #topMenu2
    {
        display: block;
    }
}