OLD | NEW |
1 <html> | 1 <html> |
2 <head> | 2 <head> |
3 <meta http-equiv="content-type" content="text/html; charset=UTF-8"> | 3 <meta http-equiv="content-type" content="text/html; charset=UTF-8"> |
4 <script src="resources/text-based-repaint.js"></script> | 4 <script src="resources/text-based-repaint.js"></script> |
5 <script type="text/javascript"> | 5 <script type="text/javascript"> |
6 function scrollAndRepaint() | 6 function scrollAndRepaint() |
7 { | 7 { |
8 scrollBy(0, 200); | 8 scrollBy(0, 200); |
9 runRepaintAndPixelTest(); | 9 runRepaintAndPixelTest(); |
10 } | 10 } |
11 | 11 |
12 function repaintTest() | 12 function repaintTest() |
13 { | 13 { |
14 document.getElementById('toMove').style.left = "150px"; | 14 document.getElementById('toMove').style.left = "150px"; |
15 document.getElementById('toMove').style.backgroundColor = "green"; | 15 document.getElementById('toMove').style.backgroundColor = "green"; |
16 } | 16 } |
17 </script> | 17 </script> |
18 </head> | 18 </head> |
19 <body onload="scrollAndRepaint()" style="height: 3000px;"> | 19 <body onload="scrollAndRepaint()" style="height: 3000px;"> |
20 <div style="position: fixed: top: 0; left: 0;"> | 20 <!-- Using 99% opacity on fixed pos elements to ensure they are not automati
cally promoted. --> |
| 21 <div style="position: fixed: opacity: 0.99; top: 0; left: 0;"> |
21 <p style="position: absolute; top: 210px">You should see a yellow rect on
the left, and a green one on the right. No red pixels.</p> | 22 <p style="position: absolute; top: 210px">You should see a yellow rect on
the left, and a green one on the right. No red pixels.</p> |
22 <div id="toMove" style="width: 100px; height: 100px; background-color: red
; position: fixed; top: 70px; left: 10px;"></div> | 23 <div id="toMove" style="width: 100px; height: 100px; background-color: red
; position: fixed; opacity: 0.99; top: 70px; left: 10px;"></div> |
23 <div style="width: 100px; height: 100px; background-color: yellow; positio
n: absolute; top: 270px; left: 10px; z-index: -5;"></div> | 24 <div style="width: 100px; height: 100px; background-color: yellow; positio
n: absolute; top: 270px; left: 10px; z-index: -5;"></div> |
24 </div> | 25 </div> |
25 </body> | 26 </body> |
26 </html> | 27 </html> |
OLD | NEW |