所以这更多的是一个好奇的问题,而不是一个实际的问题,所以请原谅我。我刚检查过:
http://www.apple.com/iphone/封面的幻灯片看起来真的让我印象深刻。我不想复制它,但我只是真正感兴趣的是它是如何工作的。从我的检查,他们只是使用一堆定时webkit过渡/转换,但我不知道到底是怎么回事。
还有,有没有一种简单的方法来创建这种行为,而不需要硬编码,因为这就是我现在要做的。
解释如下:http://johnbhall.com/iphone-4s/
我只是在回答我自己的问题,因为除了硬编码之外,没有人能真正给我一个答案。我猜苹果在这方面下了不少功夫。我仍然对CSS过渡的复杂使用印象深刻,特别是对象将过渡到下一帧
这是一个带有源代码的工作演示。
基本意思是,
-
预加载所有图片
-
有一个计时器,每N秒触发一次
-
当计时器触发时,启动转换动画,将新图像滑动进来。
对想法的细化允许你停止/反转/暂停/恢复,在一个循环后自动停止,等等。
这个效果的商标名是"slider"。你可以谷歌滑块,找到很多讨论。有用于jquery的滑块(nivoslider),有用于mootools的滑块(slideitmooo),还有与框架无关的选项(如我链接的脚本演示),等等。