OLD | NEW |
(Empty) | |
| 1 <style> |
| 2 div { |
| 3 height: 100px; |
| 4 width: 100px; |
| 5 background: blue; |
| 6 } |
| 7 </style> |
| 8 <p> |
| 9 The two squares should <strong>smoothly</strong> rock backwards and forwards. |
| 10 <div id="target1"></div> |
| 11 <div id="target2"></div> |
| 12 <script> |
| 13 var player1 = target1.animate([ |
| 14 {transform: 'none'}, |
| 15 {transform: 'rotate(90deg)'} |
| 16 ], 1000); |
| 17 |
| 18 var player2 = target2.animate([ |
| 19 {transform: 'none', background: 'blue'}, |
| 20 {transform: 'rotate(90deg)', background: 'blue'} |
| 21 ], 1000); |
| 22 |
| 23 setInterval(function() { |
| 24 player1.reverse(); |
| 25 player2.reverse(); |
| 26 }, 100); |
| 27 </script> |
OLD | NEW |