scroll-target-group-005.html (1122B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Overflow Test: scroll-target-group property invalidation - reparenting nested anchors</title> 4 <link rel="help" href="https://drafts.csswg.org/css-overflow-5/#scroll-target-group"> 5 <link rel="match" href="scroll-target-group-001-ref.html"> 6 <style> 7 .wrapper { 8 scroll-target-group: auto; 9 } 10 11 #scroller { 12 overflow: auto; 13 height: 130px; 14 width: 100px; 15 } 16 17 #scroller div { 18 width: 100px; 19 height: 100px; 20 background-color: blue; 21 margin: 5px; 22 } 23 24 a { 25 color: red; 26 } 27 28 a:target-current { 29 color: green; 30 } 31 </style> 32 <div class="wrapper"> 33 <div id="target" class="wrapper"> 34 <a href="#target1">t1</a> 35 <a href="#target2">t2</a> 36 <a href="#target3">t3</a> 37 <a href="#target4">t4</a> 38 </div> 39 </div> 40 <div id="scroller"> 41 <div id="target1"></div> 42 <div id="target2"></div> 43 <div id="target3"></div> 44 <div id="target4"></div> 45 </div> 46 <script> 47 scroller.scrollTop = 400; 48 document.documentElement.offsetTop; 49 target.classList.remove('wrapper'); 50 document.documentElement.offsetTop; 51 scroller.scrollTop = 0; 52 </script>