如何在用户的浏览器中查找当前网页的高度和宽度？

Question

我正在尝试弹出一个视频播放器。会使用fancybox，但它们是非商业的，我的用例相对简单。基本上我正在创建一个div，在黑色背景中覆盖整个页面，具有足够的不透明度，仍然可以看到所有内容。我想将YouTube视频（通过iframe硬链接插入）放置在用户页面上的当前位置（高度方面），覆盖此“覆盖”div。基本上，我不想将此视频放在用户必须滚动到的页面的高度位置。

我查看了jquery库，包括浏览器和支持，没有看到任何注意事项。有缺点的方法吗？顺便说一下，它可能是一个Javascript解决方案，我只是碰巧在其他所有方面都使用JQuery，你知道。

编辑：

我试图将这个新div（包含iframe代码）放在用户浏览器视口当前所在的位置，不确定文档的高度或浏览器视口的高度。

Answer 1

使用$（窗口）。例如：

console.log($(window).height());
console.log($(window).width());

在调整浏览器窗口大小时尝试一下，您会看到它发生变化。

如果要获取窗口视口滚动到的位置，请使用$（window）.scrollTop（）和$（window）.scrollLeft（）。

如果要获取特定元素的位置，请使用$（“＃myid”）。position（）（相对于偏移父项）或$（“＃myid”）offset（）（相对于文档）。

Answer 2

jquery Height Documentation

jquery Width Documentation

获取文件高度：
              $（窗口）.height（）;

获取文档宽度：
     $（窗口）.WIDTH（）;

Answer 3

.height()或.outerHeight()都应该有效：

http://jsfiddle.net/hL3cv/

$(window).height();
$(window).outerHeight();
$(window).width();
$(window).outerWidth();

Answer 4

我使用PrettyPhoto。它不是太大，如果你对JavaScript感到满意，你可以删除任何不需要的代码，使其更加紧凑。