Question

js怎么等css3 transition执行完后执行下面代码

比如div1.style.width="0px";
div2.style.display="block";
我想让div1先滑动消失,然后div2出现,而正常情况下,div1在width变到0的过程时,div2马上就出现了,这怎么办
大哥大姐帮帮小弟吧

Answer 1

可以在动画元素上绑定transitionEnd事件

div1.addEventListener("transitionend", fn, true);

fn函数中将div2出现

这个熟悉可能需要加浏览器前缀 没调研过

Answer 2

如果你是自己编写代码实现div1的滑动效果，那就控制下div1的消失速度。

如果用jquery里的slideToggle/slideDown/slideUp操纵div的滑动，可以用三个速度选项（
slow、normal、fast，或干脆用xx毫秒来控制速度。

Answer 3

可以在动画元素上绑定transitionEnd事件

div1.addEventListener("transitionend", fn, true);

fn函数中将div2出现

这个熟悉可能需要加浏览器前缀 没调研过

transition[英][trænˈzɪʃn][美][trænˈzɪʃən, -ˈsɪʃ-]

n.过渡，转变，变迁; [语]转换; [乐]变调; 

第三人称单数：transitions复数：transitions现在进行时：transitioning过去式：transitioned