OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <div class="target">all 10ms</div><br> | 2 <div class="target">all 10ms</div><br> |
3 <div class="target">perspective 10ms</div><br> | 3 <div class="target">transform-origin 10ms</div><br> |
4 <div class="target">-webkit-perspective 10ms</div><br> | 4 <div class="target">-webkit-transform-origin 10ms</div><br> |
| 5 <div class="target">-webkit-transform-origin-x 10ms</div><br> |
| 6 <div class="target">-webkit-transform-origin-y 10ms</div><br> |
| 7 <div class="target">-webkit-transform-origin-z 10ms</div><br> |
5 <script> | 8 <script> |
6 if (window.testRunner) { | 9 if (window.testRunner) { |
7 testRunner.dumpAsText(); | 10 testRunner.dumpAsText(); |
8 testRunner.waitUntilDone(); | 11 testRunner.waitUntilDone(); |
9 } | 12 } |
10 | 13 |
11 document.addEventListener('transitionend', function(e) { | 14 document.addEventListener('transitionend', function(e) { |
12 var result = document.createElement('div'); | 15 var result = document.createElement('div'); |
13 result.textContent = 'fired transitionend with propertyName: ' + e.propertyNam
e; | 16 result.textContent = 'fired transitionend with propertyName: ' + e.propertyNam
e; |
14 e.target.appendChild(result); | 17 e.target.appendChild(result); |
15 if (window.testRunner) { | 18 if (window.testRunner) { |
16 // All events should be fired by next frame. | 19 // All events should be fired by next frame. |
17 requestAnimationFrame(function() { | 20 requestAnimationFrame(function() { |
18 testRunner.notifyDone(); | 21 testRunner.notifyDone(); |
19 }); | 22 }); |
20 } | 23 } |
21 }); | 24 }); |
22 | 25 |
23 onload = function() { | 26 onload = function() { |
24 var targets = document.querySelectorAll('.target'); | 27 var targets = document.querySelectorAll('.target'); |
25 for (var i = 0; i < targets.length; i++) { | 28 for (var i = 0; i < targets.length; i++) { |
26 targets[i].offsetTop; | 29 targets[i].offsetTop; |
27 targets[i].style.transition = targets[i].textContent; | 30 targets[i].style.transition = targets[i].textContent; |
28 targets[i].style.webkitPerspective = '10px'; | 31 targets[i].style.webkitTransformOriginX = '10px'; |
29 targets[i].style.perspective = '10px'; | 32 targets[i].style.webkitTransformOriginY = '10px'; |
| 33 targets[i].style.webkitTransformOriginZ = '10px'; |
| 34 targets[i].style.transformOrigin = '10px 10px 10px'; |
30 } | 35 } |
31 }; | 36 }; |
32 </script> | 37 </script> |
OLD | NEW |