OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <style> | 4 <style> |
5 .test-div | 5 .test-div |
6 { | 6 { |
7 width: 100px; | 7 width: 100px; |
8 height: 100px; | 8 height: 100px; |
9 text-align: center; | 9 text-align: center; |
10 background-color: gray; | 10 background-color: gray; |
(...skipping 24 matching lines...) Expand all Loading... |
35 <div class="test-div"> | 35 <div class="test-div"> |
36 <script>addTestImg("")</script> | 36 <script>addTestImg("")</script> |
37 </div> | 37 </div> |
38 </td> | 38 </td> |
39 | 39 |
40 <!-- This test draws a single-sided img facing away from the screen. This | 40 <!-- This test draws a single-sided img facing away from the screen. This |
41 should not appear. --> | 41 should not appear. --> |
42 | 42 |
43 <td> | 43 <td> |
44 <div class="test-div"> | 44 <div class="test-div"> |
45 <script>addTestImg("-webkit-transform: rotateY(180deg);")</script> | 45 <script>addTestImg("transform: rotateY(180deg);")</script> |
46 </div> | 46 </div> |
47 </td> | 47 </td> |
48 | 48 |
49 <!-- This test rotates the div away from the screen, but keeps the | 49 <!-- This test rotates the div away from the screen, but keeps the |
50 single-sided img facing towards its div. This should appear. --> | 50 single-sided img facing towards its div. This should appear. --> |
51 | 51 |
52 <td> | 52 <td> |
53 <div class="test-div" style="-webkit-transform: rotateY(180deg)"> | 53 <div class="test-div" style="transform: rotateY(180deg)"> |
54 <script>addTestImg("")</script> | 54 <script>addTestImg("")</script> |
55 </div> | 55 </div> |
56 </td> | 56 </td> |
57 | 57 |
58 </tr><tr> | 58 </tr><tr> |
59 | 59 |
60 <!-- This test draws a img inside a div which is double-sided and does not | 60 <!-- This test draws a img inside a div which is double-sided and does not |
61 face the screen. This should not appear because preserve-3d is set for | 61 face the screen. This should not appear because preserve-3d is set for |
62 the parent div. --> | 62 the parent div. --> |
63 | 63 |
64 <td> | 64 <td> |
65 <div class="test-div" style="-webkit-transform: rotateY(180deg); -webkit-trans
form-style: preserve-3d;"> | 65 <div class="test-div" style="transform: rotateY(180deg); -webkit-transform-sty
le: preserve-3d;"> |
66 <script>addTestImg("")</script> | 66 <script>addTestImg("")</script> |
67 </div> | 67 </div> |
68 </td> | 68 </td> |
69 | 69 |
70 <!-- This test draws a img inside a div which is single-sided and does not | 70 <!-- This test draws a img inside a div which is single-sided and does not |
71 face the screen. This should appear because preserve-3d is set for the | 71 face the screen. This should appear because preserve-3d is set for the |
72 parent div. --> | 72 parent div. --> |
73 | 73 |
74 <td> | 74 <td> |
75 <div class="test-div" style="-webkit-transform: rotateY(180deg); -webkit-trans
form-style: preserve-3d; -webkit-backface-visibility: hidden;"> | 75 <div class="test-div" style="transform: rotateY(180deg); -webkit-transform-sty
le: preserve-3d; -webkit-backface-visibility: hidden;"> |
76 <script>addTestImg("-webkit-transform: rotateY(180deg);")</script> | 76 <script>addTestImg("transform: rotateY(180deg);")</script> |
77 </div> | 77 </div> |
78 </td> | 78 </td> |
79 | 79 |
80 <!-- This test draws a img inside a div which is single-sided and does not | 80 <!-- This test draws a img inside a div which is single-sided and does not |
81 face the screen. This should not appear because preserve-3d is not set | 81 face the screen. This should not appear because preserve-3d is not set |
82 for the parent div. --> | 82 for the parent div. --> |
83 | 83 |
84 <td> | 84 <td> |
85 <div class="test-div" style="-webkit-transform: rotateY(180deg); -webkit-backf
ace-visibility: hidden;"> | 85 <div class="test-div" style="transform: rotateY(180deg); -webkit-backface-visi
bility: hidden;"> |
86 <script>addTestImg("-webkit-transform: rotateY(180deg);")</script> | 86 <script>addTestImg("transform: rotateY(180deg);")</script> |
87 </div> | 87 </div> |
88 </td> | 88 </td> |
89 | 89 |
90 </tr></table> | 90 </tr></table> |
91 | 91 |
92 | 92 |
93 <script> | 93 <script> |
94 if (window.testRunner) { | 94 if (window.testRunner) { |
95 /* Instruct the test runner that this is a pixel test */ | 95 /* Instruct the test runner that this is a pixel test */ |
96 testRunner.dumpAsTextWithPixelResults(); | 96 testRunner.dumpAsTextWithPixelResults(); |
97 document.write("<span style='position:absolute; top:-5000px'>This test is
only useful as a pixel test</span>"); | 97 document.write("<span style='position:absolute; top:-5000px'>This test is
only useful as a pixel test</span>"); |
98 } | 98 } |
99 </script> | 99 </script> |
100 | 100 |
101 </body> | 101 </body> |
102 </html> | 102 </html> |
OLD | NEW |