CSS3，WebKit转换顺序？如何排队到过渡？

Question

我有以下内容：

-webkit-transition-property: top, bottom, z-index;
-webkit-transition-duration: 0.5s;

问题是我不希望z-index过渡到top＆amp;完成了。

有没有办法告诉Webkit过渡到顶部/底部过渡然后完成后，立即执行z-index还是持续时间，无论如何？

由于

Answer 1

您必须在z-index转换上指定延迟：

-webkit-transition-property: top, bottom, z-index;
-webkit-transition-duration: 0.5s;
-webkit-transition-delay: 0s, 0s, .5s;

Answer 2

对于您的信息，在javascript中，您还可以监听webkitTransitionEnd事件并在触发此事件时修改z-index。

此事件有两个有用的属性：

• propertyName：转换中涉及的属性的名称
• elapsedTime：过渡期间经过的时间