到目前为止,这是我的jsfiddle：http://jsfiddle.net/mvkMH/23/

这是我正在尝试做的事情：
我有一个< ul> ID为包含< li>的ID为.Box类.当用户点击任何.Box时,它会将.move-y类添加到($this) – 它还会同时将.move-x类添加到剩余的列表项中.当用户单击另一个.Box时,所有现有的.move-y和.move-x类都将替换为.move-y-rvs和.move-x-rvs类.一直使用CSS3 Animation事件来保持一切完美同步.

为何选择CSS3动画事件？

> CSS3动画在iOS上很快
>通过jQuery触发的CSS3动画允许你“重新启动”动画(如果已经播放)(https://css-tricks.com/restart-css-animation/)
>理论上,通过使用jQuery跟踪AnimationStart,AnimationIteration和AnimationEnd事件,可以创建非常复杂和交互式的CSS3动画.

这是脚本应该在我的脑海里工作的方式 – 我只是无法让它在现实生活中工作;-)

>单击.Box元素后,选中#main以查找任何.move-x和.move-y类
>如果检测到.move-x和.move-y类：

>用move-x-rvs和.move-y-rvs替换这些类
>使用.move-x-rvs和.move-y-rvs类将css动画事件侦听器附加到元素
>在AnimationEnd Event上删除.move-x-rvs和.move-y-rvs类
>将AnimationName设置为空字符串(如果再次单击,则重置css3动画以再次播放)
>现在将.move-y类添加到$(this)
>将.move-x类添加到所有其他剩余列表项

>如果未检测到.move-x和.move-y：

>将.move-y类添加到$(this)
>将.move-x类添加到所有其他剩余列表项

4 – 动画事件侦听器功能应附加现代浏览器的前缀(如本示例中所示 – How do I re-trigger a WebKit CSS animation via JavaScript?)

再次,到目前为止,这是我的jsfiddle：http://jsfiddle.net/mvkMH/23/

任何人们可以提供的帮助将不胜感激！

提前致谢！
Bizarro.Z