<style> | |
div { | |
position: relative; | |
height: 100px; | |
width: 100px; | |
background: blue; | |
} | |
</style> | |
Animation with endDelay on and off the compositor. The two boxes should have identical motions. | |
<br> | |
<div id="target1"></div> | |
<div id="target2"></div> | |
<script> | |
var player1 = target1.animate([ | |
{left: '0px'}, | |
{left: '400px'}, | |
], { | |
duration: 1000, | |
endDelay: -500, | |
}); | |
var player2 = target2.animate([ | |
{transform: 'translate(0px)'}, | |
{transform: 'translate(400px)'}, | |
], { | |
duration: 1000, | |
endDelay: -500, | |
}); | |
</script> |