具有100％宽度和动画滚动的CSS背景图像，直到图像完成

Question

所以我这个网站有一个大图像作为背景。现在，我不需要将图像淡化为平面颜色或图案，而是需要将其缩放到视口宽度的100％。

这并不能解决您只能看到图像的一部分（取决于浏览器大小）的问题，而且我需要让整个图像可见。向下滚动是不够的，因为那时图像会结束，我为背景选择的颜色会出现（这很糟糕）。

所以我在想如果我能拥有

• 背景图像缩放到视口宽度的100％，图像宽度的最小尺寸和
• 还会在滚动上垂直向下动画，直到
• 到达图像高度的末尾，然后它将停止，直到您向上滚动并恢复到图像的顶部，
• 具有视差效果。

分别使用easy enough，但我无法找到它们的组合，并且需要修改以限制垂直滚动。如果有人能指出我正确的方向，我会非常感激。 ：d

Answer 1

我已经创建了一个关于你在jsFiddle中描述的效果的工作演示：http://jsfiddle.net/qqW3G/ （注意：我已经为图像提供了200％的高度，以确保它足够超出窗口高度以进行演示。您将要删除它以避免图像偏斜。）

编辑：您可能考虑的另一个选项是视差滚动效果，其中身体内容比背景图像滚动得更快，从而产生深度幻觉。这是一个例子：http://jsfiddle.net/qPF2G/