我有一个函数，可以将类应用于 html 元素，还可以检测是否在 900px 宽度以下单击了下拉菜单。
当我将浏览器大小从桌面 View 调整到 900 像素以下时，我偶尔会发现下拉类“active-hit”未应用 - 这意味着菜单不会打开。有什么想法可能是为什么吗？我必须重新加载页面才能使其在移动 View 中工作。
// Add Mobile View Class to HTML ELEMENT below 900px
(function($) {
var $window = $(window),
$html = $('html');
$dropdown = $('.dropdown-nav > a');
function resize() {
if ($window.width() < 900) {
$dropdown.on('click', function(e){
$(this).parent().toggleClass('active-hit');
e.preventDefault();
e.stopPropagation();
});
return $html.addClass('mobile-view');
} else {
$html.removeClass('mobile-view');
$dropdown.parent().removeClass('active-hit');
}
}
$window
.resize(resize)
.trigger('resize');
})(jQuery);
最佳答案
正如我在评论中提到的，窗口大小调整不会触发您的功能，但如果您想在测试目的中这样做，那么您可以尝试使用此:
$(window).resize(function() {
resize();
});
这里正在工作 fiddle为你
关于javascript - 响应式移动菜单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48703903/