jquery - 检测浏览器调整大小不起作用

Question

我试图在浏览器调整大小时发出 jQuery 警报，但它不起作用。

http://jsfiddle.net/5m6yG/

function browser_resize(){
    var window_height = $(window).height();

    if ((window_height>=800)) {
        alert('800 or above!');
    }
    if ((window_height<800)) {
        alert('Under 800!');
    }
}
$(window).resize(browser_resize);

那是行不通的。当我调整浏览器的大小时，即使超过 800，它仍然会提示“低于 800！”。问题是什么？

Answer 1

这是因为$(window).height();为您提供了 的高度，而result iframe不是浏览器的高度。

请参阅jsFiddle。

function browser_resize(){
    $("#height").html($(window).height());
}
$(window).resize(browser_resize);

另一个演示300px height

function browser_resize(){
    var window_height = $(window).height();

    if ((window_height>=300)) {
        $("#height").html('300 or above!');
    }
    if ((window_height<300)) {
        $("#height").html('Under 300!');
    }
}
browser_resize();
$(window).resize(browser_resize);

Answer 2

为了测试，我在这里保持高度 200 并且它对我来说工作正常：

function browser_resize() {
    var window_height = $(window).height();
    console.log(window_height)
    if (window_height >= 200) {
        console.log('200 or above!');
    } else {
        console.log('Under 200!');
    }
}
$(window).resize(browser_resize);

您需要为此检查浏览器控制台。

另外，我认为这里不需要第二个if语句。你可以把它放在else部分。

Answer 3

检查这个 sout 演示http://jsfiddle.net/5m6yG/4/

jQuery

function browser_resize(){
    var window_height = $(window).height();

    if ((window_height>=500)) {
        alert('500 or above!');
    }
    else if ((window_height<500)) {
        alert('Under 500!');
    }
}
$(window).resize(browser_resize);