OLD | NEW |
---|---|
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src="resources/text-based-repaint.js"></script> | 2 <script src="resources/text-based-repaint.js"></script> |
3 <script> | 3 <script> |
4 function repaintTest() { | 4 function repaintTest() { |
5 scroller.style.background = 'green local'; | 5 scroller.style.outline = '1px solid green'; |
6 } | 6 } |
7 onload = runRepaintAndPixelTest; | 7 onload = runRepaintAndPixelTest; |
8 </script> | 8 </script> |
9 <style> | 9 <style> |
10 #scroller { | 10 #scroller { |
11 background: red local; | |
12 overflow: scroll; | 11 overflow: scroll; |
13 width: 200px; | 12 width: 200px; |
14 height: 200px; | 13 height: 200px; |
15 will-change: transform; | 14 will-change: transform; |
15 outline: 1px solid blue; | |
flackr
2016/10/25 21:26:30
nit: it may be good to start the outline red so th
yigu
2016/10/27 20:21:26
That makes more sense.
| |
16 outline-offset: -4px; | |
16 } | 17 } |
17 | 18 |
18 .spacer { | 19 .spacer { |
19 height: 300px; | 20 height: 300px; |
20 } | 21 } |
21 </style> | 22 </style> |
22 <!-- #scroller has a locally attached background which will be painted into the | 23 <!-- #scroller has a negative offset outline which should not be covered up by |
23 scrolling contents layer. When the color changes it should repaint. --> | 24 the scrollbar. When the color changes it should repaint. --> |
24 <div id="scroller"> | 25 <div id="scroller"> |
25 <div class="spacer"></div> | 26 <div class="spacer"></div> |
26 </div> | 27 </div> |
OLD | NEW |