Question

我创建了一个使用过的正文的网页设计：在标记到＆＃39; split＆＃39;之前设计，类似于WordPress的TwentyFifteen主题（https://wordpress.org/themes/twentyfifteen/）

但是我没有使用颜色用于＆＃34; left＆＃34;列，但图像。该代码适用于所有浏览器（Chrome，FF，Safari），但不适用于IE（版本9-11）。

CSS看起来像：

body::before {
    background: url("img/back-left.jpg") no-repeat center top ;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    content: "";
    display: block;
    height: 100%;
    min-height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    width: 30%;
    z-index: 1;
}

效果：当用IE打开页面时，背景图片没有显示。当我去一个子站点时，图片显示出来了。当我转换浏览器窗口时，图片显示。当我在IE Dev工具栏中更改ANYTHING（无论如何）时，图片显示。

如果我使用背景颜色而不是背景（或背景图像），它可以在IE上正常工作。

有什么想法吗？我觉得这听起来像是渲染的东西。背景图像渲染太晚，因此没有显示（相反，我在页面上进行交互）。但是如何解决呢？

Answer 1

我找到了一个解决问题的解决方案。 ; - ）

当我设置

html, body { overflow: auto; }

然后，背景图像在IE 10和IE 11中正确显示。但是现在我有IE 11平滑滚动问题（使用鼠标滚轮时背景图像遍布整个地方。使用滚动条时，它工作良好）。无论如何，这种变体对我来说比不显示背景图像更好。所以我仍然希望，MS纠正了平滑滚动的错误。

我使用此更正在CodePen中创建了一个分支：http://codepen.io/anon/pen/rabMMm

（这是最初的CodePen代码：http://codepen.io/anon/pen/qEwEVy）

或者有没有人知道从IE修复平滑滚动问题的解决方案？

正文中的背景图像：IE之前无法正常工作

1 个答案: