修复Chrome中的后台附件错误

查看此网站时 http://jsfiddle.net/dN4S4/1405/ 在带有Mac retina显示器的chrome上,背景渲染不正确。这是使用的CSS:

body{
  width: 100%;
  height: 100%;
  margin: 0;
  position: absolute;
}
#cards{
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.card-wrapper{
    width: 100%;
    height: 100%;
    background: url(url here);
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
}
.card{
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.875);
    font-family: "Helvetica Neue", Helvetica, Arial;
    font-size: 14px;
    text-align: left;
    color: #FFFFFF;
}

我发现这是一个已知的问题,但还没有找到一个实际可行的修复方法。它在任何其他浏览器上都能按预期渲染,甚至在chrome中以“正常”显示查看网站时也能正常工作。

为了简单起见,我在演示中使用了相同的图像,但是我想使用不同的图像来创建“视差”效果。

请不要认为身体上的“位置:绝对”不会导致此问题。它也会出现在不同的“位置”和“显示”值中。

有没有关于如何正确渲染的建议?

谢谢