Jquery Parallax滚动效果 - 多方向

Question

我需要为客户端构建一个多方向的JQuery视差页面 - 他们基本上希望它以类似的方式工作 - https://victoriabeckham.landrover.com/INT

我准备好了艺术品,并找到了许多jquery库,可以让我滚动水平/垂直 - 但我不知道如何在特定的坐标上将两者结合在一起.有谁能指出我正确的方向？

编辑:我最初在看过Superscrolarama并认为所有问题都已解决之后签了这个帖子 - 但是我一直在努力实现它 - 我不认为它是我认为的救星,我需要水平和垂直视差以及滚动到实现以上,它似乎不支持 - 所以任何其他提示,我将非常感激!

Answer 1

我把东西扔在一起对你来说是个好主意.

http://jsfiddle.net/9R4hZ/40/

该脚本首先初始化所有对象的起始位置.然后为箭头键和鼠标滚轮设置处理程序.之后是parallaxScroll函数中算法的核心.

它使用ARROWS或MOUSEWHEEL进行滚动.

来自[左,右,顶部,底部]过渡.

HTML和CSS非常简单.

运行它的JS/jQuery是不言自明的.

这是一个有趣的效果,似乎适合艺术类型的网站.

Answer 2

您是否看过像Scrollrama这样的图书馆http://johnpolacek.github.com/scrollorama/或Curtain http://curtain.victorcoulon.fr/？

我知道在你的问题中你提到你已经看过不同的图书馆但是根据它们的工作方式,很难真正建议如何使用正确的坐标.

*edit1

如果你还没有看到它,那么scrolllorama的作者也会做一个超级卷曲,这会给动画带来更多的控制,例如当一个元素固定时动画.

http://johnpolacek.github.com/superscrollorama/

Answer 3

smashinghub.com上的这篇文章展示了一个用于滚动和视差效果的JQuery插件集合,我完全相信其中一个会帮助你.它看起来像jQuery Scroll Path是最先进的或适合您的要求.