javascript - 适合窗口高度的图像

Question

我正在尝试实现类似于 this 的东西那种有图像填充窗口的东西，直到你向下滚动。我真的不知道如何实现这一目标。我猜是通过 jQuery 吗？我真的找不到任何东西。我对 jQuery 的了解有限，但我对 Javascript 有所了解。

感谢您的帮助。

---

Answer 1

您根本不需要 jQuery 或 Javascript。您需要一个带有背景图片的全屏 div。

Working JSFiddle

HTML:

<div class="fullscreenimg"></div>

CSS:

.fullscreenimg {

   background-image:url(IMAGEURL);

   background-size:cover;

   width:100%;

   height:100%;

}

编辑:正如评论中所指出的，这将适用于现代浏览器和几个以前的浏览器，但它不适用于旧版本 (6-8) 的 IE。

旧浏览器的替代方法是使用 <img> , 并将其绝对定位，使用 top , bottom',左 , and对, all being set to 0`。这会拉伸(stretch)它，而不是调整大小。