这个Skrollr 3D旋转效果是如何实现的？

Question

我是一个相当新的仍然在学习的开发人员，今天我遇到了感兴趣的网站。 http://www.lobagola.com/我检查了源代码并查看了开发人员使用并发现了Skrollr的脚本。

他使用了什么样的图像？他们只是简单的静态图像或某种我不熟悉的3D图像，我如何使用Skrollr实现这种效果？我已阅读文档，我不认为我遇到过这样的例子。

Answer 1

当在同样的情况我一般打开我的Internet Exploer的开发工具与F12（是啊，是啊...其他浏览器得到了类似的工具来做到这一点，你可能看起来有点）和去网络选项卡，它允许您跟踪由当前网页引起的所有网络活动。

一旦启用（绿色的 “戏” 图标），我打按Ctrl + F5 到强制重新加载整个页面。

之后，我只是通过加载的所有文件，看看我能找到我想要的。您不必阅读代码或解释任何内容。在这个例子中，我一直在寻找一个电影文件或类似的东西。

显然不需要HTML5，本页使用"sprite sheet" with the different frames of these animated transitions。

也有单个图像，明显用作占位符和后备。

当滚动浏览幻灯片时，页面将计算一个介于0和图像文件中帧数之间的索引并显示（使用CSS格式切换）。