Fatal编程技术网
  • javascript/
  • Javascript 缩放背景图像以适应ie8窗口

Javascript 缩放背景图像以适应ie8窗口

javascript html css internet-explorer-8 drupal-7

Javascript 缩放背景图像以适应ie8窗口,javascript,html,css,internet-explorer-8,drupal-7,Javascript,Html,Css,Internet Explorer 8,Drupal 7,我使用Drupal7模块加载背景图像，但IE8不支持css3的大小调整 background-image: url('image.jpg'); background-size: cover; 我无法使用通常的方法轻松加载图像，例如将图像放入DIV或使用ms filter alphaimageloader加载图像 如果不能仅使用ie8支持的CSS来实现这一点，那么javascript解决方案是不错的。（同样适用于ie7的东西也很棒，但ie8是优先考虑的）。将全尺寸背景图像添加到Internet

我使用Drupal7模块加载背景图像，但IE8不支持css3的大小调整

background-image: url('image.jpg');
background-size: cover;
我无法使用通常的方法轻松加载图像，例如将图像放入DIV或使用ms filter alphaimageloader加载图像

如果不能仅使用ie8支持的CSS来实现这一点，那么javascript解决方案是不错的。（同样适用于ie7的东西也很棒，但ie8是优先考虑的）。

将全尺寸背景图像添加到Internet Explorer 8和ie7中 由于您不能使用常用的方法轻松地在站点中放置背景，您可以在代码中放置图像吗？如果是这样，这个解决方案可能会奏效。我用它来模拟IE8和IE7的全屏背景，效果很好

将图像放在html代码中body标记的正后方。（您可能会根据站点结构将其放置在其他位置，但您可能必须添加z索引。）接下来，本例中的背景将包装在IE条件注释中，因此只有IE8及以下版本才会看到它。（注意：它在IE6中有缺陷，但您可能可以让它工作？如果没有，只需调整条件注释，使其仅包括IE7和IE8）

HTML代码

<!DOCTYPE html>
<head></head>
<body>
<!--[if lte IE 8]><img src="../path-to-your-image/your-photo.jpg" class="ie87-bg"><![endif]-->
您可能已经知道这一点，但这里有3种方法可以针对旧版本的IE：

  • JavaScript浏览器功能检测-mattstow.com/layout-engine.html
  • Css黑客-BrowserHacks.com
  • 条件评论
    • 有用提示：
    背景图像：无覆盖
    背景尺寸：封面
    。黑客是在IE6
    中关闭自定义IE背景的一种方法。ie87 bg{u display:none；}
    

    位置：固定
    在移动/触摸屏中有问题。默认
    位置：滚动触摸效果良好。背景想法来自本教程-
    我可以在IE8的全窗口上拉伸图像
    

    我不知道你为什么没有获得投票，或者你的回答没有被接受，但你只是让我停止了3个小时的撞墙。有条件的陈述真的帮我解决了问题！！！谢谢

    .ie87-bg {
display:block;
position:fixed;
top:0;
left:0;
min-height:100%;
min-width:1024px;
width:100%;
height:auto;
margin:0;
padding:0;
}