我使用StickyPanel,Smooth-Scroll和Scrolly,我需要固定的(内容移到它)背景的甚至“页”,以及视差背景(内容&背景分开移动)单数'页'。所以我的 '页' 去甚至,奇,甚至,奇,甚至。 '网页'是5个div,一个在另一个之下,并且每个div设置为浏览器窗口的高度&,以制作单页网站。视差背景不占满“页”区域
我遇到的问题是在具有视差背景的'页面'2 & 4中,背景被错误定位。通过检查元素,我发现由设置的背景位置滚动是如此遥远,背景图像甚至不显示。 Scrolly提供了两个属性与滚动背景在元素上设置:
<div data-velocity=".3" data-fit="1000">
这些允许设置视差元件的速度和分别设置相对背景位置。我发现,当我使用data-fit属性调整背景时,它永远不会出现在正确的位置,因为'页面'以及背景高度都与浏览器窗口有关。
我需要背景总是覆盖div,即如果背景图像是没有透明度的图像,那么div的背景颜色永远不会显示。
我认为可能会将背景设置为比浏览器窗口多10%左右,但我不知道该怎么做。
这是一个jsFiddle,虽然由于某些原因,背景图像不会显示在'页面'5上。我还将背景图像设置为占位符,并将div设置为随机背景颜色,发展。
这是一个很难解释的问题,所以我可能没有彻底表达我的观点。如果我想一个更好的方式来解释这个问题,我会更新我的帖子。
谢谢