Question

我有一些jQuery在屏幕尺寸上做了一些事情。问题是我想在事件调整大小窗口上这样做。这就是我现在所拥有的：

if ($(window).width() >= 1000) {
    jQuery('ul.nav li.dropdown').hover(function () {
        jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeIn();
    }, function () {
        jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut();
    });
    jQuery(".menu-heading").addClass("disabled");
    jQuery(".menu-submenu").addClass("text-right");
}
else {
    jQuery(".menu-heading").removeClass("disabled");
    jQuery(".menu-submenu").addClass("text-center");
}

我确实在加载时工作，如果屏幕较小则需要调整大小以删除它并仅添加

jQuery(".menu-heading").removeClass("disabled");
jQuery(".menu-submenu").removeClass("text-right");
jQuery(".menu-submenu").addClass("text-center");

这必须发生在窗口加载和窗口调整大小，任何帮助吗？

Answer 1

使用窗口 resize() ，并调用您在窗口上载时使用的相同功能。

$( window ).resize(function() {
     //Your function

});

这不起作用。

jQuery('ul.nav li.dropdown').hover(function () {
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeIn();
}, function () {
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut();
});

改为使用 mouseover() ，

jQuery('ul.nav li.dropdown').mouseover(function () {
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeIn();
}, function () {
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut();
});

Answer 2

尝试使用

window.onresize = function(e) {

};

并在ifs中插入不同的分辨率，并为每个分辨率添加适当的类。

Answer 3

你可以尝试：

$(window).resize(function(){
    toggleClass();
});
$(document).ready(function(){
    toggleClass();
});

function toggleClass()
{
// your code here.
}

在调整大小窗口中添加类和下拉列表？

3 个答案: