dynamic-shape-outside-1.html (1153B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <head> 4 <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 5 <title>Dynamic change to shape-outside</title> 6 <style> 7 .circle { 8 float: left; 9 width: 25vmin; 10 height: 25vmin; 11 background: #f06; 12 } 13 </style> 14 <script> 15 function doTest() { 16 let circle = document.querySelector(".circle"); 17 circle.style.shapeOutside = "circle()"; 18 19 document.documentElement.removeAttribute('class'); 20 } 21 document.addEventListener("MozReftestInvalidate", doTest); 22 </script> 23 </head> 24 <body> 25 <div class="circle"></div> 26 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent 27 scelerisque pretium interdum. Nam rhoncus auctor consequat. Duis porta 28 tortor eu nibh efficitur, eget tempor tortor semper. Integer eu sem 29 placerat, sodales tortor at, ornare orci. Fusce id malesuada est. Aenean 30 mattis augue sapien. Fusce efficitur ante sed porttitor blandit. Nam 31 facilisis aliquam elit, ut consequat quam interdum sit amet. Integer 32 bibendum turpis at mi dapibus dictum. Donec id lorem arcu. Pellentesque 33 tortor nunc, semper a dui vel, maximus varius orci. Maecenas posuere 34 enim in tempor imperdiet. 35 </body> 36 </html>