| <!DOCTYPE html> | |
| <style> | |
| div { | |
| width: 200px; | |
| height: 200px; | |
| } | |
| .blur { | |
| filter: blur(10px); | |
| } | |
| .accelerated { | |
| will-change: transform; | |
| } | |
| #resize { | |
| background-color: green; | |
| } | |
| </style> | |
| <div class="blur"> | |
| <div class="accelerated" id="resize"></div> | |
| </div> | |
| <script src="../resources/text-based-repaint.js"></script> | |
| <script> | |
| function repaintTest() { | |
| var resizeElement = document.getElementById("resize"); | |
| resizeElement.style.width = "100px"; | |
| } | |
| window.onload = runRepaintAndPixelTest; | |
| </script> |