滚动一些div并同时滚动正文

时间:2017-04-02 06:57:54

标签: javascript css scroll

首先,我不想在问之前开始尝试这个,我想知道如何做到这一点:

body{width: 100%; height: 150%; background: url('someimg.png') no-repeat; background-size: 100% 100%}
div{width: 100%; margin-top: 300px; height: 100%; background: red;}//and this div contains other elements so his content became scrollable

现在你知道一些例子,当你向后滚动时,滚动和前面都是滚动,但是后面比前面慢很多,就像我向下滚动30%我想要身高150%高度向下滚动30%和高度为300%的div同时向下滚动30%,因此看起来背景图像也是滚动但速度较慢。

我想问你使用哪种方式?

 CSS3, JAVASCRIPT or SOMETHING ELSE? OR MIXED? 

1 个答案:

答案 0 :(得分:0)

好的,所以我认为你正在寻找视差效果。您可以通过使用jquery或有时只使用CSS手动编写代码来完成此操作,但如果您刚刚开始,可能需要花费很多时间,我建议您使用以下插件: 1. Parallax.js
2. Skrollr
3. Parallax-Scroll
还有更多...只是 google parallax scroll plugins ,因为其中一些非常容易使用,这将节省大量时间。