scroll-buttons-dynamic-create-remove.html (730B)
1 <!doctype html> 2 <title>CSS Overflow Test: ::scroll-button() can be created and removed dynamicaly</title> 3 <link rel="help" href="https://drafts.csswg.org/css-overflow-5/#scroll-buttons"> 4 <link rel="match" href="../reference/ref-filled-green-100px-square.xht"> 5 <style> 6 #carousel { 7 overflow: hidden; 8 width: 100px; 9 height: 100px; 10 } 11 12 #carousel div { 13 background: green; 14 width: 100px; 15 height: 100px; 16 } 17 18 .scroll-buttons::scroll-button(right) { 19 content: "r"; 20 } 21 </style> 22 <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> 23 <div id="carousel"> 24 <div></div> 25 <div> 26 <script> 27 carousel.offsetTop; 28 carousel.className = "scroll-buttons"; 29 carousel.offsetTop; 30 carousel.className = ""; 31 </script>