Javascript 可见窗口高度而不是 $(window).height();
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7008504/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Visible window height instead of $(window).height();
提问by curly_brackets
Is there any way to get the visible height of the whole page from inside an iframe, $(window).height()gives me the iframes height?
有什么方法可以从 , 内部获取整个页面的可见高度iframe，$(window).height()给我iframes 高度？
回答by lonesomeday
If you are using frames, you can get the height of the outermost window by using window.topin the jQuery constructor. The height of window.topwill get the height of the browser window.
如果您使用的是框架，则可以通过window.top在 jQuery 构造函数中使用来获取最外层窗口的高度。的高度window.top将获得浏览器窗口的高度。
$(window.top).height();
Edit: Updated window.top reference as Mozilla moved their documentation around.
编辑：更新 window.top 参考，因为 Mozilla 移动了他们的文档。
回答by MarutiB
I have always used this implementation
我一直使用这个实现
window.innerHeight or document.body.clientHeight or document.documentElement.-clientHeightdepending on the browser.
window.innerHeight or document.body.clientHeight or document.documentElement.-clientHeight取决于浏览器。
But i don't see why jquery's $(window).height() wont work for your visible height ?
但我不明白为什么 jquery 的 $(window).height() 对你的可见高度不起作用？
回答by Brian Peacock
I had cause to address a similiar issue today, because in FF screen.heightand window.innerHeightreturn the same value, and of course my first response was to check for solutions on SO. In the end this is how I addressed the matter, and I'm posting the longwinded version here for posterity only...
我今天有理由解决一个类似的问题，因为在 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);
It might help someone, sometime.
有时它可能会帮助某人。
