在我的情况下如何将元素适合屏幕

Question

我有一个复杂的问题需要你帮助。

我有一个非常大的图像，并有几个图像映射链接。

当我点击图片链接时，我想在其上显示一个包含图像和内容的新div，并从一个非常小的元素转换到适合浏览器屏幕（覆盖原始页面）。我创建了我的代码和文件，但不知道如何适应屏幕功能。任何人都可以帮我吗？非常感谢。

http://jsfiddle.net/kB27M/5/

请点击我的jsfiddle图片中的“overside load”标记。然后你会看到一个图像弹出并调整大小。我需要确保它调整到我的浏览器窗口的100％。谢谢！

Answer 1

我冒昧地删除了一些代码并添加了其他代码， 要获取窗口大小，您可以在width()对象上使用jquery方法window，与height()相同;

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

将它组合在一起，您需要的新div窗口大小需要设置如下：

$(contentDiv).width($(window).width());
$(contentDiv).height($(window).height());

现在你想把它叠加到窗口上，你可以通过将position设置为fixed来轻松实现它，所以鼠标滚动不会影响它：

$(contentDiv).css("position","fixed");
$(contentDiv).css({top:0, left:0});

检查出来

FIDDLE