使固定的Gridview标头忽略浏览器滚动条JQuery

Question

有没有办法让固定标题仅响应JQuery中的一个滚动条？在这种情况下，只响应div滚动条而不是浏览器滚动条。或者是否有不同的解决方案。我试图摆脱浏览器滚动条，但然后所有的gridview争用都无法访问。

背景： 我有一个JQuery克隆的gridview标题，里面有一个带滚动条的div，这是代码：

    function fixedHeader() {
        // Code to copy the gridview header with style
        var gridHeader = $('#<%=GridView1.ClientID%>').clone(true).attr('id','clonedGrid'); 
        //Code to remove all rows except the header row
        $(gridHeader).find("tr:gt(0)").remove();
        $('#<%=GridView1.ClientID%> tr th').each(function (i) {
            // Here Set Width of each th from gridview to new table th 
            $("th:nth-child(" + (i + 1) + ")", gridHeader).css('width', ($(this).width()).toString() + "px");
        });
        // Append Header to the div controlHead
        $("#controlHead").append(gridHeader);
        // Set its position to be fixed
        $('#controlHead').css('position', 'fixed');
        // Put it on top
        $('#controlHead').css('top', $('#<%=GridView1.ClientID%>').offset().top);
    }

当窗口最大化时它工作得很好但是当我重新调整浏览器大小并显示浏览器滚动条时，标题将遵循两个滚动条（div中的一个和浏览器中的一个）使标题变为当我使用浏览器滚动条滚动时，也可以移动，从而使固定标题关闭，如下所示！] 1。

Answer 1

所以我修改了我的JQuery代码，将其更改为绝对代码，并添加了z索引，并将每个th的高度从网格设置为新的克隆表 这就是代码的样子并且100％工作

    function fixedHeader() {
        // Code to copy the gridview header with style
        var gridHeader = $('#<%=GridView1.ClientID%>').clone(true).attr('id','clonedGrid'); 
        //Code to remove all rows except the header row
        $(gridHeader).find("tr:gt(0)").remove();
        $('#<%=GridView1.ClientID%> tr th').each(function (i) {
            // Here Set Width of each th from gridview to new table th 
            $("th:nth-child(" + (i + 1) + ")", gridHeader).css('width', ($(this).width()).toString() + "px");
            // Here Set height of each th from gridview to new table th 
            $("th:nth-child(" + (i + 1) + ")", gridHeader).css('height', ($(this).height()).toString() + "px");
        });
        // Append Header to the div controlHead
        $("#controlHead").append(gridHeader);
        // Set its position to be fixed
        $('#controlHead').css('position', 'absolute');
        // Bring the header in front of everything else
        $('#controlHead').css('z-index', '200');
        // Put it on top
        $('#controlHead').css('top', $('#<%=GridView1.ClientID%>').offset().top);
    }