0

我使用 CSS 在某些断点处显示和隐藏元素。我还使用 jquery 切换来显示/隐藏元素。如果我将浏览器大小调整为移动设备大小，一切正常，但是当我调整浏览器大小以使其更大时，我使用 Jquery 隐藏的元素随后被隐藏，在我的网页中留下空白。我需要一种无缝的方式来在窗口调整大小或改变方向时重置为原始值。

例如，我有一个用 CSS 为平板电脑或移动设备隐藏的菜单 div，我使用 CSS 而不是菜单显示菜单图标。然后，我在选择图标时使用 Jquery 显示/隐藏菜单。如果我将浏览器放大或将手机或平板电脑的方向更改为横向，如果用户使用图标隐藏菜单，则菜单不会显示。我怎样才能解决这个问题？

4

1 回答 1

1

我也有同样的问题。这是我的解决方案的一个非常简单的版本：

$(window).on('resize',function(){
    if($(this).width() > 800){
        $('#Menu').removeAttr('style');
    }
});

或者菜单应该显示的宽度。这摆脱了 jQuery 通过点击按钮放入的“显示/隐藏”内联 CSS。

我会说我的解决方案涉及更多组件......在一个函数中，我注意到.on()处理程序为移动版本应用了一百万次，所以我.off()之前有.on('click')......类似的东西。但是核心组件是去掉了jQuery给菜单的样式属性，这样你给它的CSS就不再被覆盖了。

于 2013-03-29T18:36:39.147 回答