jquery - 背景图像 - 全尺寸

Question

您需要使用edge或mozilla打开以下页面。
这是页面:codepen.io
这是我尝试过的:

html{
  max-height:1900px;
  max-width:2600px;
}

因此，当访问者缩小时，我不希望图像缩小并露出空白区域。我希望图像保持不变并缩小。我希望我说的有些道理。

注意:我使用jquery来获取背景图片。

document.body.style.backgroundImage = "url(http://eskipaper.com/images/sunny-day-4.jpg)";

Answer 1

为什么要使用 jquery 将图像加载到正文中？那太矫枉过正了。您可以通过 CSS 加载它:

html { 
  background: url('http://eskipaper.com/images/sunny-day-4.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

这将使您的图像在缩放时保持固定大小。不需要 javascript。

实例:http://codepen.io/anon/pen/ZONGZX