1 <html><head> 2 3 <meta content="text/html; charset=windows-1251" http-equiv="Content-Type"> 4 <style> 5 .d1{position:fixed;top:50%;right:50%;z-index:2;overflow:hidden;} 6 .d2{position:fixed;bottom:0;left:0;z-index:2;width:100%;background-color:darkgray;} 7 .o {background:green;height:40px;width:200px;} 8 .t { width:2000px; height:198px;background-color: lightgray; border: 1px solid blue;} 9 body { margin: 0px; } 10 </style> 11 <script> 12 function remove_fixed() 13 { 14 document.getElementById("d2").style.position = "static"; 15 } 16 17 function add_fixed() 18 { 19 document.getElementById("d2").style.position = "fixed"; 20 } 21 22 </script> 23 </head> 24 <body> 25 <div class="d2" id="d2">This is the parent div. 26 <div class="d1" id="d1"><div class="o">This is the nested div.</div></div> 27 </div> 28 <div class="t"> 29 000 30 </div> 31 <div class="t"> 32 200 33 </div> 34 <div class="t"> 35 400<br> 36 <button onclick="remove_fixed();">remove fixed</button> 37 </div> 38 <div class="t"> 39 600<br> 40 <button onclick="add_fixed();">add fixed</button> 41 </div> 42 <div class="t"> 43 800 44 </div> 45 <div class="t"> 46 1000 47 </div> 48 <div class="t"> 49 1200 50 </div> 51 <div class="t"> 52 1400 53 </div> 54 <div class="t"> 55 1600 56 </div> 57 <div class="t"> 58 1800 59 </div> 60 <div class="t"> 61 2000 62 </div> 63 <div class="t"> 64 2200 65 </div> 66 <div class="t"> 67 2400 68 </div> 69 <div class="t"> 70 2600 71 </div> 72 <div class="t"> 73 2800 74 </div> 75 <div class="t"> 76 3000 77 </div> 78 <div class="t"> 79 3200 80 </div> 81 <div class="t"> 82 3400 83 </div> 84 <div class="t"> 85 3600 86 </div> 87 <div class="t"> 88 3800 89 </div> 90 <div class="t"> 91 4000 92 </div> 93 </body></html> 94