如何在 Chrome 中修复我的背景

Question

在我正在处理的网站上，我有一个背景图像，我想要填充浏览器的100%宽度和100%高度并修复。下面的代码适用于ie10和Firefox 23，但在Chrome中不起作用（背景不固定 - 它会滚动）。

现场演示：http://ridge.mydevelopmentserver.com/

<div id="mainContent" class="bg1">my content</div>
#mainContent {
height: auto;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
color:#777777;
padding:20px;
box-sizing: border-box;
}
.bg1 {
background:url(../images/backgrounds/bg1.jpg)  no-repeat center center fixed;   
}

有人知道如何在Chrome中修复背景吗？

谢谢:)

Answer 1

添加固定在.bg1的位置，左，上，右和下零，不要忘记溢出-y：滚动;

.bg1 {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: url(../images/backgrounds/bg1.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    overflow-y: scroll;
    }