Question

有没有办法从iframe内部获取整页的可见高度，$(window).height()会给我iframe的高度？

Answer 1

如果您正在使用框架，则可以使用jQuery构造函数中的window.top来获取最外层窗口的高度。 window.top的高度将获得浏览器窗口的高度。

$(window.top).height();

编辑：更新了window.top引用，因为Mozilla移动了他们的文档。

Answer 2

我一直使用这个implementation

window.innerHeight or document.body.clientHeight or document.documentElement.clientHeight取决于浏览器。

但是我不明白为什么jquery的$（窗口）.height（）不能用于你的可见高度？

Answer 3

我今天有理由要解决类似的问题，因为在FF screen.height和window.innerHeight中返回相同的值，当然，我的第一个响应是检查SO的解决方案。最后，这就是我的解决方法，我在这里发布了冗长的版本，仅供后人参考。

function visibleWindowHeight( callback ) {
    /* create temporary element 'tmp' */
    var vpHeight,
        tmp = document.createElement('div');

    tmp.id = "vp_height_px";

    /* tmp height = viewport height (100vh) */
    tmp.setAttribute("style", "position:absolute;" +
        "top:0;" +
        "left:-1px;" +
        "width:1px;" +
        "height:100vh;");

    /* add tmp to page */
    document.body.appendChild(tmp);

    /* get tmp height in px */
    vpHeight = document.getElementById("vp_height_px").clientHeight;

    /* clean up */
    document.body.removeChild(tmp);

    /* pass value to callback and continue */
    callback( vpHeight );
}

document.addEventListener('DOMContentLoaded', function() {

    visibleWindowHeight( function( visibleHeight ) {

        console.log("visibleHeight:", visibleHeight);
        /*
            ... continue etc etc  ...
        */
    });

}, !1);

有时可能会对某人有所帮助。

可见窗口高度而不是$（窗口）.height（）;

3 个答案: