图像滑动背景内容

Question

我正在尝试让我的网站与http://allfiredupinc.com/类似，因此当您向下滑动时，它不显示背景，然后显示内容。当您向上滚动时，它会显示背景。

body {
        background: url("http://uploadir.com/u/j027zo9j") no-repeat top center fixed;
        background-size: cover; 
}

我怎样才能添加这样的内容？它显示出很好的效果吗？

Answer 1

将margin-top添加到您的内容容器中，因此如果您的内容容器具有ID #main-content，则可以使用此样式：

#main-content {
    /* Adjust this value as you want */
    margin-top: 30em;
    /* Other properties */
    ...
}