看一下moodi.org,sony.com / be-moved,http://www.spaceneedle.com/home/, 。我怎么能这样做网站?
答案 0 :(得分:1)
基本上,这一切都是通过检测用户的滚动量并相应地移动来完成的。
你需要一些JavaScript,当然还有html& css实现类似的目标。
JS所做的是它检测用户是否正在滚动,它的方向和速度,然后告诉对象“A”以相反的滚动方向移动,并且还以0.8的速度移动。对象“B”以相反的方向移动,但滚动速度为1.2,所以你会觉得对象“B”更接近你。
这只是一个非常简单的例子。
在触摸代码之前,请记住要有一个好的方案,在编码时,将问题分解成小块并在此处查找, 例如:如何根据客户端scrollTop更改绝对元素的位置? 这就是你将要学习的方式。
有许多技术,为了使事情变得高效和清洁,您需要熟悉它们以做出最佳决策。 以下是一些可以帮助您开始的链接:
这些只是一些起点,当然你可以找到更多的教程,甚至可以浏览你喜欢的网站的来源,看看他们是如何实现这种效果的。
最后说明:我认为要记住的一件重要事情是不要同时移动多个物体,一旦它们离开视口,停止移动它们,这对于特别是在旧机器上的性能有很大帮助。 jQuery Waypoint是一个方便的工具,在第二个链接中引入。