我有Skrollr的问题。当向下滚动时,我有一个div(灰色)从左到右改变它的位置。在div(黄色)内,还有另一个div。只要父div仍在改变它的位置,我希望它保持在同一高度。我尝试通过更改margin-top来做到这一点,就像这样:
<div id="grey" data-100="right:100%;" data-700="right:50%;">
<div id="yellow" data-100="margin-top:200px;" data-700="margin-top:800px;"</div></div>
And that's what happens. 一切都会好的,但黄色的div在向右移动时上下恭维。有没有办法解决这个问题而不使用'position:fixed'?谢谢你的帮助!
编辑:顺便说一句,在iPad上它可以正常工作。
答案 0 :(得分:1)
浏览器将黄色div向上移动(使用其他所有内容,因为它正在滚动)并稍后将margin-top
动画再次向下移动。获得完美结果的唯一方法是fixed
。
但是你可以通过禁用黄色div的平滑滚动来使它稍微好一些。滚动速度非常快时,你仍会看到它跳跃。
<div id="yellow" data-smooth-scrolling="off" data-100="margin-top:200px;" data-700="margin-top:800px;"</div>
另外,我建议使用CSS转换而不是保证金。
<div id="yellow" data-smooth-scrolling="off" data-100="transform:translate(0, 200px);" data-700="transform:translate(0, 800px);"</div>