| <!DOCTYPE html> |
| <style> |
| .box { |
| height: 200px; |
| width: 200px; |
| border: 1px solid black; |
| background-repeat: no-repeat; |
| background-size: 100px 100px; |
| background-position: 0 0, 100px 100px; |
| background-image: url('../images/resources/green-256x256.jpg'), url('../images/resources/dice.png'); |
| } |
| |
| .composited { |
| transform: translate3d(0, 0, 0); |
| } |
| |
| .composited.changed { |
| transform: translate3d(50px, 50px, 0); |
| } |
| </style> |
| <script src="resources/text-based-repaint.js"></script> |
| <script> |
| function repaintTest() |
| { |
| document.getElementById('test').classList.add('changed'); |
| } |
| |
| onload = runRepaintTest; |
| </script> |
| <div id="test" class="composited box"> |
| </div> |