我在哪里可以研究有关此进展的信息，请滚动到页面＆＃39;

Question

我找到了一个我非常喜欢的网站功能。我对前端Web开发仍然相当新，我无法找到有关使用滚动技术的任何信息here。

它是页面的页面＆＃39;滚动我感兴趣，我需要的只是技术的名称，所以我可以研究和自学。

谢谢！

Answer 1

这是网页设计的最新技术，名为

视差滚动

• 借助HTML5和CSS3等新技术，可以在浏览器中创建更高级，有趣和卓越的效果。

• 当下的一个重要的网页设计趋势是视差滚动，它涉及背景以较慢的速度移动到前景，在向下滚动页面时创建3D效果。

---

有用的链接

• Wiki
• Simple Tutorial
• 46 great examples of parallax scrolling websites

---

Answer 2

我不知道这个“页面到页面滚动”效果的名称是什么，但是当您在页面的开头滚动时，桌面灯上会使用视差效果。 / p>

此外，执行“页面到​​页面滚动”效果的库是 fullPage.js ，它位于此处：https://github.com/alvarotrigo/fullPage.js

您可以在SO上看到相关问题：How can I achieve this background scroll effect?和Differential scrolling?

编辑：从链接的帖子中引用自己来获得完整答案：

  

  
• 来自Nike http://www.nike.com/jumpman23/aj2012/
的精彩演示   
• 一系列视差http://webdesignledger.com/inspiration/21-examples-of-parallax-scrolling-in-web-design   （确保看到每个例子，有些真的很棒！ex：   http://benthebodyguard.com/index.php http://www.siebennull.com/   http://janploch.de/）
  
• Mercedez Class A网站http://a-class.mercedes-benz.com/com/en/index.html#!/?s=live（不是   真的是视差但仍然很棒）
  
• 有关如何使用视差效果制作图像滑块的教程http://tympanus.net/codrops/2011/01/03/parallax-slider/
  
• 另一个具有不同效果的教程http://tympanus.net/codrops/2012/03/15/parallax-content-slider-with-css3-and-jquery/
  
• 要做视差的图书馆https://github.com/cameronmcefee/plax
  
• 另一个图书馆https://github.com/markdalgleish/stellar.js
  

     

你可能也喜欢这个：

     

  
• http://johnpolacek.github.com/scrollorama/
  
• http://joelb.me/scrollpath/