返回信息流我最近做的百度前端学院的一个题，要求是对于正方形的移动增加相应动画，包括移动和旋转。我是对这个正方形div设置了transition: all 1s;快速连续点击两下有问题（如图所示），不知道是什么原因，希望大神指点！万分感谢！！[ema1]
在线效果见https://9494huihui.github.io/baiduqianduan/zong/zong5.html
代码见https://github.com/9494huihui/baiduqianduan/blob/master/zong/zong5.html
这是一条镜像帖。来源：北邮人论坛 / java-script / #2045同步于 2017/4/20
该镜像源已超过 30 天没有更新，可能在源站已被删除。
JavaScript机器人发帖
【已解决】请教一个关于transition动画的问题
ler
2017/4/20镜像同步6 回复
订阅后，新回复会通过你的通知中心匿名送达。
6 条回复
【 在 wodebupt 的大作中提到: 】
: 是会这样的，连续点击的话，后面那次点击的transition会覆盖前面那次的，而不是等前面那次执行完
我看了一下别人的实现效果，没有这个问题
改成下面这样就可以了
var topVal = parseInt(getStyle(gogo).top);
function gotop(){
if(topVal-51 < 1 || topVal-51 > 510){
alert("主人主人，越雷池啦~~");
}
else{
topVal = topVal - 51;
gogo.style.top = topVal + "px";
}
}
【 在 ler 的大作中提到: 】
: 我看了一下别人的实现效果，没有这个问题
在调用这个函数的时候应该要取到实时的值，不能放在外面吧？
【 在 wodebupt 的大作中提到: 】
: 改成下面这样就可以了
: var topVal = parseInt(getStyle(gogo).top);
: function gotop(){
: if(topVal-
: .........
发自「贵邮」
因为用了transition，所以你要取实时的值就不对了，你可以打印log看下
【 在 ler 的大作中提到: 】
: 在调用这个函数的时候应该要取到实时的值，不能放在外面吧？
:
: 发自「贵邮」
我知道了，不能用window.getComputedStyle()来取实时的left值，应该取修改后的样式left值，我把left和top直接在行内设置了，问题解决了，多谢啦！！
【 在 wodebupt 的大作中提到: 】
: 因为用了transition，所以你要取实时的值就不对了，你可以打印log看下