【问题标题】:How to make a HTML5 scrolling page as in this example?如本例所示,如何制作 HTML5 滚动页面?
【发布时间】:2013-10-26 21:17:45
【问题描述】:

我有兴趣制作带有页面滚动功能的 HTML5 页面:http://www.apple.com/iphone-5s/

如果有人能指出这种滚动是如何进行的和/或涉及哪些框架或可以达到相同的结果,我将不胜感激。

【问题讨论】:

  • 这是一个名为 script.aculo.us 的 Javascript 库:script.aculo.us
  • scriptaculous 已死。上次发布时间为 2010 年 12 月 23 日

标签: javascript html css web


【解决方案1】:

这很容易。

绑定到鼠标滚动,并创建幻灯片。

<div class="b-slider">
   <div class="b-sider__item">
      Item 1
   </div>
   <div class="b-sider__item">
      Item 2
   </div>
   <div class="b-sider__item">
      Item 3
   </div>
   <div class="b-sider__item">
      Item 4
   </div>
   <div class="b-sider__item">
      Item 5
   </div>
</div>

并使用带有垂直滚动选项的 jcarousel 滑块插件

$('.b-slider').jcarousel('next');

【讨论】:

  • 为了达到类似的结果,他必须使用 css transition 值。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-10-21
  • 2013-11-10
  • 1970-01-01
相关资源
最近更新 更多