| OLD | NEW |
| (Empty) |
| 1 <!-- Based on fast/repaint/position-change-keeping-geometry.html --> | |
| 2 <!DOCTYPE html> | |
| 3 <script src="resources/paint-invalidation-test.js"></script> | |
| 4 <script> | |
| 5 function changePositionKeepingGeometry(id, newPosition) { | |
| 6 var target = document.getElementById(id); | |
| 7 var originalTop = target.offsetTop; | |
| 8 var originalLeft = target.offsetLeft; | |
| 9 target.style.position = newPosition; | |
| 10 target.style.top = originalTop + 'px'; | |
| 11 target.style.left = originalLeft + 'px'; | |
| 12 } | |
| 13 | |
| 14 function paintInvalidationTest() | |
| 15 { | |
| 16 changePositionKeepingGeometry('target1', 'absolute'); | |
| 17 changePositionKeepingGeometry('target2', 'absolute'); | |
| 18 changePositionKeepingGeometry('target3', 'fixed'); | |
| 19 } | |
| 20 onload = runPaintInvalidationTest; | |
| 21 </script> | |
| 22 <style> | |
| 23 body { | |
| 24 margin: 0; | |
| 25 } | |
| 26 div { | |
| 27 width: 100px; | |
| 28 height: 100px; | |
| 29 top: 20px; | |
| 30 background-color: blue; | |
| 31 } | |
| 32 #target0 { | |
| 33 left: 20px; | |
| 34 position: relative; | |
| 35 } | |
| 36 #target1 { | |
| 37 left: 20px; | |
| 38 position: relative; | |
| 39 } | |
| 40 #target2 { | |
| 41 left: 220px; | |
| 42 position: fixed; | |
| 43 z-index: 0; | |
| 44 } | |
| 45 #target3 { | |
| 46 left: 420px; | |
| 47 position: absolute; | |
| 48 z-index: 0; | |
| 49 } | |
| 50 </style> | |
| 51 There should be no invalildations on change of position without actual change of
position and size. | |
| 52 <!-- target0 ensures we don't strip anonymous wrappers (and trigger a layout) wh
en the other elements change position. --> | |
| 53 <div id="target0"></div> | |
| 54 <div id="target1"></div> | |
| 55 <div id="target2"></div> | |
| 56 <div id="target3"></div> | |
| OLD | NEW |