jquery - jQuery视差教程？

Question

我需要在我为客户构建的网站中使用 jquery 视差，我主要是后端开发人员，所以我正在学习更多关于前端和 jquery 等的知识。我遇到过http://www 等示例。 nikebetterworld.com/和教程但是我担心版权问题，所以我想知道是否有人为初学者找到了一个可靠且简单的教程来创建视差效果？谢谢

score 22 · Accepted Answer

一些教程，对于之前在此线程中提到的任何教程，我们深表歉意：

一些可能有用的插件可以很好地处理视差：

查看时加载内容：https ://github.com/protonet/jquery.inview
航点：http: //imakewebthings.com/jquery-waypoints/
横向滚动滑动内容：http ://tympanus.net/codrops/2011/12/05/lateral-on-scroll-sliding-with-jquery/
jQuery 延迟动画：http: //james.padolsey.com/javascript/jquery-delay-plugin/
滚动到：http : //demos.flesler.com/jquery/scrollTo/
滚动路径： http ://joelb.me/scrollpath/

我特别喜欢滚动到视图时触发 CSS3 动画的 inview 插件。

并且，一些用于灵感和代码窥探的更多视差网站的可爱示例：

http://www.awwwards.com似乎充斥着视差网站。

score 15 · Accepted Answer

我参加聚会很晚了，但只是为了无耻的自我推销而再扔一个:)，几天前我整理了一个简单的教程：

http://blog.fraser-hart.co.uk/jquery-parallax-scrolling/

如果您对那里的任何事情有任何疑问，请随时给我发消息，我可以与您讨论您不确定的任何事情。

score 4 · Accepted Answer

一个快速的谷歌出现了这个。

http://www.ianlunn.co.uk/blog/code-tutorials/recreate-nikebetterworld-parallax/

score 3 · Accepted Answer

我昨天刚刚完成了一个工作:) 你应该考虑使用：http://johnpolacek.github.com/scrolldeck.js/ 或http://www.jarallax.com/demo/ （适用于 android）#its a全新的项目，因此仍在开发中

对于易于自定义的滚动点，您可以使用：http : //cssdeck.com/labs/swayiqbq/2（在覆盖默认滚动点时非常有用（在scrolldeck.js中从幻灯片到幻灯片））

不确定你是只处理代码，还是同时处理图形和代码，如果是第一种情况，你应该指导你的设计师这个东西是如何工作的，以便真正使用视差效果。此外，在某些情况下，让 1920x1080 中的所有内容看起来与 1024x768 中一样具有吸引力可能会非常具有挑战性。

score 3 · Accepted Answer

3

也试试这个 :) 非常易于使用和自定义 http://johnpolacek.github.com/scrolldeck.js/

于 2012-09-07T11:04:06.353 回答

score 0 · Accepted Answer

在这里，我收集了一些来自不同网站的最佳视差滚动教程，您可以从中学习。这是链接 http://www.andwecode.com/tutorials/parallax-scrolling-tutorials/

jquery - jQuery视差教程？

6 回答 6

Related

Reference