blob: 87730a59db19925f399d9b2cf3a2a8b18a6d946a [file] [log] [blame]
<style>
div {
position: relative;
height: 100px;
width: 100px;
background: blue;
}
</style>
Player started then cancel()/finish(). Neither of the boxes should move.
<br>
<div id="target1"></div>
<div id="target2"></div>
<script>
var player1 = target1.animate([
{transform: 'translate(0px)'},
{transform: 'translate(800px)'}
], {
duration: 1000,
delay: 100
});
var player2 = target2.animate([
{transform: 'translate(0px)'},
{transform: 'translate(800px)'}
], {
duration: 1000,
delay: 100
});
setTimeout(function() {
player1.cancel();
player2.finish();
}, 10);
</script>