小球不會動也不報錯，是什么問題？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Promise animation</title>
<style>
.ball{
width:40px;
height: 40px;
border-radius: 20px;
}
.ball1{ background: red }
.ball2{ background: yellow }
.ball3{ background: green }
</style>
</head>
<body>
<div class="ball ball1" style="margin-left: 0"></div>
<div class="ball ball2" style="margin-left: 0"></div>
<div class="ball ball3" style="margin-left: 0"></div>
<script>
var b1 = document.querySelector('.ball1')
var b1 = document.querySelector('.ball2')
var b3 = document.querySelector('.ball3')
console.log(b1)
function animate(ball ,distance, cb){
setTimeout(function(){
var marginLeft = parseInt(ball.style.marginLeft,10)
if(marginLeft === distance){
cb && cb()
//console.log('hahaha')
}else{
if(marginLeft < distance){
marginLeft++
}else{
marginLeft--
}
ball.style.marginLeft = marginLeft
animate(ball,distance,cb)
}
},13)
}
animate(b1, 100, function(){
animate(b2, 200, function(){
animate(b3, 300, function(){
animate(b3, 50, function(){
animate(b2, 50, function(){
animate(b1, 50, function(){
//
})
})
})
})
})
})
</script>
</body>
</html>
2017-08-19
ball.style.marginLeft = marginLeft+'px';