anchor-scroll-chained-002-ref.html (753B)
1 <!DOCTYPE html> 2 <style> 3 body { 4 margin: 0; 5 } 6 7 div { 8 width: 100px; 9 height: 100px; 10 } 11 12 #scroller1 { 13 width: 200px; 14 height: 200px; 15 } 16 17 #scroller1,#scroller2 { 18 overflow: scroll; 19 } 20 21 #anchor { 22 height: 20px; 23 background: orange; 24 } 25 26 #anchored1 { 27 position: absolute; 28 top: 70px; 29 background: green; 30 } 31 32 #anchored2 { 33 position: absolute; 34 top: 170px; 35 background: lime; 36 } 37 38 </style> 39 40 <div id="scroller1"> 41 <div style="height: 100px"></div> 42 <div id="scroller2"> 43 <div style="height: 230px"></div> 44 <div id="anchor"></div> 45 <div style="height: 230px"></div> 46 </div> 47 <div style="height: 100px"></div> 48 </div> 49 <div id="anchored1"></div> 50 <div id="anchored2"></div> 51 52 <script> 53 scroller1.scrollTop = 80; 54 scroller2.scrollTop = 200; 55 </script>