Jquery条件由窗口宽度淡化

Question

我想将子菜单设为fadeIn，但窗口宽度仅为850px以上。我的代码只有在我刷新页面时才有效，但是当我调整窗口大小（或更改手机定向）时我也想这样做。怎么了？

function WinSize() {
    var winwidth = $(window).width();
    if (winwidth > 850) {
        $('#main-menu > ul > li').on({
            mouseenter: function() {
                $(this).find("ul").fadeIn(300);
            },
            mouseleave: function() {
                $(this).find("ul").fadeOut(300);
            }
        });
    }
}

$(window).on("load resize", WinSize);

Answer 1

尝试在.on内移动条件。目前，当加载窗口大小为＆gt;时，您将成为绑定事件。 850并且不影响实际的.on事件

function WinSize() {
    $('#main-menu > ul > li').on({
        mouseenter: function() {
            var winwidth = $(window).width();

            if (winwidth > 850) {
                $(this).find("ul").fadeIn(300);
            }
        },
        mouseleave: function() {
            var winwidth = $(window).width();

            if (winwidth > 850) {
                $(this).find("ul").fadeOut(300);
            }
        }
    });
}

$(window).on("load resize", WinSize);