transitions-inline-rewrap-2.html (842B)
1 <html class="reftest-wait"> 2 <title>Test for CSS transitions and re-wrapping of inlines</title> 3 <style type="text/css"> 4 #test { transition: 20ms color linear 0; } 5 </style> 6 <script type="text/javascript"> 7 8 window.onload = run; 9 10 function run() { 11 var test = document.getElementById("test"); 12 var unused = test.offsetWidth; 13 unused = getComputedStyle(test, "").color; 14 test.style.color = "green"; 15 unused = test.offsetWidth; 16 unused = getComputedStyle(test, "").color; 17 test.parentNode.style.width = "3em"; 18 unused = test.offsetWidth; 19 unused = getComputedStyle(test, "").color; 20 setTimeout(step2, 100); // give transition time to run 21 } 22 function step2() { 23 document.documentElement.removeAttribute("class"); 24 } 25 26 </script> 27 <div style="width: 50em"> 28 <span id="test" style="color: red"> 29 This is some text with a transition. 30 </span> 31 </div>