Question

我正在开展一个小小的课外项目，以加强我的html5 / css3 / jquery知识，我正在使用Parallax Scrolling，但我似乎无法将底部图像滚动到视图中。它似乎停留在上面它上面，无论我做什么，我似乎无法把它拉到视野中。

底部黑色部分应该有一个巨额美元钞票，上面写着“安倍是钱”

我的网址是：http://www.petegetscreative.com/abe/index.html

灵感来自本教程：http://net.tutsplus.com/tutorials/html-css-techniques/simple-parallax-scrolling-technique/

欢呼声

Answer 1

我认为美元钞票图像太小了。

查看this Fiddle，当我将美元钞票图像的尺寸增加到200％时，它会在预览中显示。

#known { 
    background: url(http://www.petegetscreative.com/abe/images/US-$5-SC-1953-Fr.1655.2.jpg) 50% 0 no-repeat fixed;
    background-color: #000;
    background-size: 200%;
    height: 600px;  
    margin: 0 auto; 
    width: 100%; 
    max-width: 1920px; 
    position: relative; 
    padding-top: 50px;
}

所以可能发生的是图像的高度小于滚动位置的差异。尝试更大（更高）的图像。

Answer 2

我认为问题可能是美元图像小于部分标记，而您正在运行的脚本将bg图像置于负Y位置。您可以进行测试，使图像大于650px（截面的高度）。

视差滚动图像不在视野范围内

2 个答案: