微件:Sandbox:修订间差异
跳转到导航
跳转到搜索
无编辑摘要 |
无编辑摘要 |
||
| 第2行: | 第2行: | ||
<p>payload</p> | <p>payload</p> | ||
<p>payload</p> | <p>payload</p> | ||
<div id="table-container"> | <div id="fixed-header-table-container"> | ||
<table id=" | <table id="fixed-header-table"> | ||
<thead> <tr> <th>Col1</th> <th>Col2</th> <th>Col3</th> </tr> </thead> | <thead> <tr> <th>Col1</th> <th>Col2</th> <th>Col3</th> </tr> </thead> | ||
<tbody> | <tbody> | ||
<tr> <td>info</td> <td>info</td> <td>info</td> </tr> | <tr> <td>info</td> <td>info</td> <td>info</td> </tr> | ||
<tr> <td>info</td> <td>info</td> <td>info</td> </tr> | <tr> <td>info</td> <td>info</td> <td>info</td> </tr> | ||
<tr> <td>info</td> <td>some really long line/td> <td>info</td> </tr> | <tr> <td>info</td> <td>some really long line</td> <td>info</td> </tr> | ||
<tr> <td>info</td> <td>info</td> <td>info</td> </tr> | <tr> <td>info</td> <td>info</td> <td>info</td> </tr> | ||
<tr> <td>info</td> <td>info</td> <td>info</td> </tr> | <tr> <td>info</td> <td>info</td> <td>info</td> </tr> | ||
| 第15行: | 第15行: | ||
</tbody> | </tbody> | ||
</table> | </table> | ||
<div id=" | <div id="fixed-header-table-bottom"></div> | ||
</div> | </div> | ||
<p>payload</p> | <p>payload</p> | ||
| 第25行: | 第25行: | ||
window.onscroll = function() { | window.onscroll = function() { | ||
var pos = window.scrollY; | var pos = window.scrollY; | ||
var top = document.getElementById(" | var top = document.getElementById("fixed-header-table").offsetTop; | ||
var bottom = document.getElementById(" | var bottom = document.getElementById("fixed-header-table-bottom").offsetTop; | ||
var hdr = document.getElementById('fixed-table-header'); | var hdr = document.getElementById('fixed-table-header'); | ||
if (top < pos && pos < bottom) { | if (top < pos && pos < bottom) { | ||
if (hdr == null) { | if (hdr == null) { | ||
table = document.getElementById(' | table = document.getElementById('fixed-header-table'); | ||
hdr = table.cloneNode(true); | hdr = table.cloneNode(true); | ||
hdr.id = 'fixed-table-header'; | hdr.id = 'fixed-table-header'; | ||
| 第37行: | 第37行: | ||
hdr.style.top = 0; | hdr.style.top = 0; | ||
hdr.style.width = table.style.width; | hdr.style.width = table.style.width; | ||
document.getElementById("table-container").appendChild(hdr); | document.getElementById("fixed-header-table-container").appendChild(hdr); | ||
hdr.style.visibility = 'hidden'; | hdr.style.visibility = 'hidden'; | ||
for (var i = 0; i < hdr.childNodes.length; i++) | for (var i = 0; i < hdr.childNodes.length; i++) | ||