element-paint-multiple-backgrounds-01c.html (1042B)
1 <!-- 2 Any copyright is dedicated to the Public Domain. 3 http://creativecommons.org/licenses/publicdomain/ 4 Dynamic repaint with multiple -moz-element background images 5 --> 6 <!DOCTYPE html> 7 <html class="reftest-wait"> 8 <head> 9 <style> 10 11 #box { 12 height: 100px; 13 width: 200px; 14 background: -moz-element(#darkred) top left no-repeat, 15 -moz-element(#black) top right no-repeat red; 16 } 17 18 div > div { 19 width: 100px; 20 height: 100px; 21 } 22 23 </style> 24 </head> 25 <body style="margin:0"> 26 <div id="box"></div> 27 28 <div style="overflow:hidden; height:0"> 29 <div id="darkred" style="background-color: darkred"></div> 30 <div id="black" style="background-color: black"></div> 31 <div id="lime" style="background-color: lime"></div> 32 <div id="green" style="background-color: green"></div> 33 </div> 34 35 <script> 36 37 window.addEventListener("MozReftestInvalidate", function () { 38 document.getElementById("box").style.backgroundImage = "-moz-element(#lime), -moz-element(#green)"; 39 document.documentElement.className = ""; 40 }); 41 42 </script> 43 44 </body> 45 </html>