当用户使用jQuery将其滚动到视图外时，表头保持固定在顶部

当用户使用jQuery将其滚动到视图外时，表头保持固定在顶部

您可以通过点击上的

scroll

事件处理程序

window

并使用另一个

table

具有固定位置的事件处理程序来执行此 *** 作，以在页面顶部显示标题。

HTML：

<table id="header-fixed"></table>

CSS：

#header-fixed {    position: fixed;    top: 0px; display:none;    background-color:white;}

Javascript：

var tableOffset = $("#table-1").offset().top;var $header = $("#table-1 > thead").clone();var $fixedHeader = $("#header-fixed").append($header);$(window).bind("scroll", function() {    var offset = $(this).scrollTop();    if (offset >= tableOffset && $fixedHeader.is(":hidden")) {        $fixedHeader.show();    }    else if (offset < tableOffset) {        $fixedHeader.hide();    }});

当用户向下滚动足够远以隐藏原始表头时，将显示表头。当用户再次向上滚动页面足够远时，它将再次隐藏。