| OLD | NEW |
|---|
| (Empty) | |
| 1 <html> |
| 2 <style> |
| 3 div { |
| 4 position: relative; |
| 5 height: 100px; |
| 6 width: 100px; |
| 7 background: yellow; |
| 8 } |
| 9 </style> |
| 10 <body> |
| 11 <p> |
| 12 Each section below has two boxes, the top runs on the main thread, the bottom |
| 13 on the compositor. |
| 14 </p><p> |
| 15 This test is successful if the boxes are mostly in sync and all finish at the |
| 16 same time. |
| 17 </p> |
| 18 <hr> |
| 19 |
| 20 Multiple iframes test. |
| 21 <br> |
| 22 <div id="test1_blink">BLINK THREAD</div> |
| 23 <div id="test1_impl">IMPL THREAD</div> |
| 24 <hr> |
| 25 |
| 26 <script> |
| 27 var leftKeyframes = [ |
| 28 {left: '100px'}, |
| 29 {left: '600px'} |
| 30 ]; |
| 31 var translateKeyframes = [ |
| 32 {transform: 'translateX(100px)'}, |
| 33 {transform: 'translateX(600px)'} |
| 34 ]; |
| 35 |
| 36 var player1_blink = test1_blink.animate(leftKeyframes, { |
| 37 duration: 5000, |
| 38 delay: 100, |
| 39 }); |
| 40 var player1_impl = test1_impl.animate(translateKeyframes, { |
| 41 duration: 5000, |
| 42 delay: 100, |
| 43 }); |
| 44 </script> |
| 45 |
| 46 <iframe src="compositor-animation-steps.html" style="border: 0; width: 100%; hei
ght: 50%">No iframe</iframe> |
| 47 |
| 48 <iframe src="compositor-animation-same-property.html" style="border: 0; width: 1
00%; height: 50%">No iframe</iframe> |
| 49 |
| 50 </body> |
| 51 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 946323002:
Animations: Introduce compositor AnimationPlayer and AnimationTimeline. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master