【发布时间】：2012-06-14 22:48:40
【问题描述】：
我正在努力根据那些带有向下翻转数字的旧时钟构建一个简单的动画。我在下面添加了一张从 Premium Pixels 上找到的免费赠品 PSD 复制的图片：
我遇到的最大问题是使用 jQuery 全部在 HTML/CSS/JavaScript 中构建“翻转”动画。我发现的唯一教程是from this net tuts+ article，它实际上使用了图像。它将时钟的上半部分和下半部分分成两个不同的图像集，并在每经过一秒时替换它们......
这种方法在网站中是不现实的，因为它没有为读者提供实际的上下文。我更喜欢将数字硬编码到 HTML 中，并仅通过 jQuery 执行翻转动画 - 除了背景自动收报机框之外最好没有图像。或者换句话说，数字被编码成 HTML，但时钟本身是一系列 rolodex 风格的 bg 图像。
我希望我已经解释得足够好。我已经为此苦苦挣扎了几天，老实说，我不知道如何处理这个脚本。也许通过将上半部分和下半部分分成不同的 div，然后改变每一秒的内部数字？我在 jQuery 方面相当不错，但我在动画方面很弱。
提前感谢您的支持！
【问题讨论】：
-
试试jQuery image rotate技术。
-
也许这可能是一个开始.. dabblet.com/gist/2360985
-
@OscarBroman 不错，但看起来这是一个实验性功能，大多数版本都不支持。
-
大多数最新的浏览器都支持它，除了 IE（和往常一样）。
-
@OscarBroman 嘿，哇，你是用 CSS3/HTML5 编码的吗？根本没有jquery？我想这样的东西可以工作..
标签： javascript jquery jquery-ui animation