var ball1=document.querySelector('ball-1');

var ball2=document.querySelector('ball-2');

var ball3=document.querySelector('ball-3');

var Promise = window.Promise;

function promiseAnimate(ball, distane){

return new Promise(function(resolve, reject){

function _animate(){

setTimeout(function(){

var marginLeft = parseInt(ball.style.marginLeft, 10)

if (marginLeft===distane) {

resolve()

} else{

if(marginLeft < distane){

marginLeft++

} else{

marginLeft--

}

ball.style.marginLeft = marginLeft + 'px'

_animate()

}

},13)

}

_animate()

})

}

promiseAnimate(ball1, 100)

.then(function(){

return promiseAnimate(ball2, 200)

})

.then(function(){

return promiseAnimate(ball3, 300)

})

.then(function(){

return promiseAnimate(ball3, 150)

})

.then(function(){

return promiseAnimate(ball2, 150)

})

.then(function(){

return promiseAnimate(ball1, 150)

})