| <html><head> | |
| <meta name="viewport" content="width=device-width"> | |
| <style> | |
| .d1 {position:fixed; top:5; right:5; z-index:2; overflow:hidden;} | |
| .o {background:green; height:40px; width:200px;} | |
| .t { width:2000px; height:198px; background-color: lightgray; border: 1px solid blue;} | |
| body { margin: 0px; } | |
| </style> | |
| <script> | |
| var fixed; | |
| function remove_child() | |
| { | |
| fixed = document.getElementById("d1"); | |
| fixed.parentElement.removeChild(fixed); | |
| } | |
| function add_child() | |
| { | |
| document.body.appendChild(fixed); | |
| } | |
| </script> | |
| </head> | |
| <body> | |
| <div class="d1" id="d1"><div class="o">This is a test</div></div> | |
| <div class="t"> | |
| 000 | |
| </div> | |
| <div class="t"> | |
| 200<br> | |
| <button onclick="remove_child();">remove fixed</button> | |
| </div> | |
| <div class="t"> | |
| 400<br> | |
| <button onclick="add_child();">add fixed</button> | |
| </div> | |
| <div class="t"> | |
| 600<br> | |
| </div> | |
| <div class="t"> | |
| 800 | |
| </div> | |
| <div class="t"> | |
| 1000 | |
| </div> | |
| <div class="t"> | |
| 1200 | |
| </div> | |
| <div class="t"> | |
| 1400 | |
| </div> | |
| <div class="t"> | |
| 1600 | |
| </div> | |
| <div class="t"> | |
| 1800 | |
| </div> | |
| <div class="t"> | |
| 2000 | |
| </div> | |
| <div class="t"> | |
| 2200 | |
| </div> | |
| <div class="t"> | |
| 2400 | |
| </div> | |
| <div class="t"> | |
| 2600 | |
| </div> | |
| <div class="t"> | |
| 2800 | |
| </div> | |
| <div class="t"> | |
| 3000 | |
| </div> | |
| <div class="t"> | |
| 3200 | |
| </div> | |
| <div class="t"> | |
| 3400 | |
| </div> | |
| <div class="t"> | |
| 3600 | |
| </div> | |
| <div class="t"> | |
| 3800 | |
| </div> | |
| <div class="t"> | |
| 4000 | |
| </div> | |
| </body></html> |