page-refresh - 将窗口大小调整到特定高度时刷新浏览器窗口

Question

任何人都可以建议一些javascript代码，当窗口调整到特定高度时，这些代码会刷新浏览器窗口。类似于 CSS 媒体查询。

即，如果浏览器最大高度为 700 像素，则刷新。

提前致谢。

Answer 1

我最近一直在做类似的事情，我正在使用一个很好的 JavaScript 函数：

var viewportwidth;
var viewportheight;

function resize() {
    // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight

    if (typeof window.innerWidth != 'undefined') {
        viewportwidth = window.innerWidth,
        viewportheight = window.innerHeight
    }

    // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)

    else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0) {
        viewportwidth = document.documentElement.clientWidth,
        viewportheight = document.documentElement.clientHeight
    }

    // older versions of IE

    else {
        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
        viewportheight = document.getElementsByTagName('body')[0].clientHeight
    }
}

这将获得浏览器的当前高度和宽度。如果您想检查用户何时调整页面大小并调用该resize()函数，只需使用一个简单的 JavaScript 命令window.onresize=resize();

这是基本功能。从这里开始对代码进行一些更改应该很容易。例如，如果您希望仅在宽度大于或等于 700 时刷新页面，请在resize()函数中添加如下内容：

if(viewportwidth >= 700) {
    window.reload();
}