jquery - 如果窗口大于不工作，则简单

Question

我在响应式设计中为这种简单的 if 结构而苦苦挣扎。基本上它是一个导航元素从下拉列表切换到浮动列表。在 960 像素内调整大小时，下拉菜单不起作用。我当前的代码有问题吗？

$(window).load(function(){
var windowWidth = $(window).width();
function checkSize() {
    if(windowWidth < 960) {
        quickDrop();
    }
}
function quickDrop(){
    $("#quicklinks").hover(function() {
        $("#quicklinks > ul").stop(true,true).slideDown("fast");
        $sitesArrow.css({ WebkitTransform: 'rotate(270deg)'});
        $sitesArrow.css({ '-moz-transform': 'rotate(270deg)'});
    }, function(){
        $("#quicklinks > ul").stop(true,true).slideUp("fast");
        $sitesArrow.css({ WebkitTransform: 'rotate(0deg)'});
        $sitesArrow.css({ '-moz-transform': 'rotate(0deg)'});
    });
}
checkSize();

$(window).resize(function(){
    checkSize();
});
});

谢谢！

http://jsfiddle.net/bdGPz/

Answer 1

你需要把var windowWidth = $(window).width();你的checkSize()功能。

function checkSize() {
    var windowWidth = $(window).width();
    if(windowWidth < 960) {
        quickDrop();
    }
}

否则windowWidth只会在window.load您请求该功能时而不是每次都获得一个值checkSize()。