| <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> |