我正在尝试使用metro js插件合并两个动画。我想将multiple stops动画与flip animation结合起来。翻转动画应该在延迟之后发生。你能帮我开始使用一些示例代码吗？
感谢您的帮助。
答案 0 :(得分：0)
这取决于你正在寻找多少黑客。
这样做有一个简短而肮脏的方法，但我不能保证它可以跨浏览器工作，如果你关心同步问题，你还需要仔细调整。
为了解释，您可以在另一个图块的框架内嵌入一个图块，但内部图块在显示时是否“智能”：每次再次显示时都不会重置其动画
如果您以翻转图块作为外部动画开始，则将多个停靠图块嵌入翻转的第一面，您可以显示多个停靠点，然后翻转图块。
在这方面变得棘手的是delay值就是：动画之间的延迟，但不考虑动画运行的时间。为了在翻转前显示多个停靠区块的所有停靠点，您的翻转区块的延迟必须为：number-of-stops * ( multiple-stops-tile-delay + multiple-stops-tile-single-animation-time ) - flip-tile-single-animation-time
Here is an example jsfiddle （我只修改了给出的两个示例），其中翻转图块的延迟设置得不够长，因为我无法计算/编码潜水ms动画时代。我只是使用了停止次数*延迟时间。因此，将多个停靠区块设置为6000延迟并停止3次，我将父级翻转区块设置为18000延迟。如果你让它运行超过几次翻转它将完全不同步。
注意：我在Chrome，Firefox和IE 9中对此进行了测试，它基本上适用于所有三种，但IE可能有奇怪的延迟时间与其他两种不同，这可能会停止无法在所有三种浏览器中翻转同步。
更长更优雅的方法会涉及对插件进行代码更改以强制为其他磁贴内部的磁贴重置动画，或采用类似的方法，但超越简单地指出它将超出直接答案的范围。