背景大小的替代方案:在IE7 +中覆盖

Question

我的网页正文上有背景图片.我已经习惯background-size:cover使图像在身体上伸展,同时保持图像的纵横比.我想这对IE7 + IE8来说是一样的.

我环顾四周,看到以下代码:

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='AutumnWinter_4.jpg',
    sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='AutumnWinter_4.jpg',
    sizingMethod='scale')";

但这并没有保留宽高比,这对我们所瞄准的网站来说真的很糟糕.

有没有办法做到这一点？没有点击jQuery？

Answer 1

不使用jQuery的原因是什么？您可以IE<8仅在条件注释中加载它,以便对于每个其他现代浏览器都不加载jQuery.

还要考虑IE7的市场份额非常低(2.25%,2012年4月),因此如果此功能对您的站点/应用程序非常重要,则可以为该特定浏览器加载〜25kb的额外费用.

所以,我发现了jQuery的这个插件:https://github.com/louisremi/jquery.backgroundSize.js

一个jQuery cssHook在1.5K中添加对IE6-7-8的"封面"和"包含"的支持

有关详细信息,请参阅Github项目页面.

Answer 2

backgroundSize.js 实际上不会拉伸 IE7 中的背景图像，它似乎只是将其居中于原始大小。查看他们的演示并单击“检查 IE6-7-8 用户通常会看到的内容”。

@丹鲁尔

我读到 backstretch将在 IE7+ 中工作

祝你好运！