jquery - 固定ヘッダーのjquery

Question

データテーブルに固定ヘッダー機能を追加しようとしています。

次のステートメントを追加しました。new FixedHeader( oTable);

oTable = $('#mytable').dataTable({ 
    "aaSorting": [ [0,'asc'] ], "aoColumns" : dataTableColumns, "oLanguage": {   
        "sLengthMenu": 'Show <select>'+ 
                       '<option value="10">10<\/option>'+ 
                       '<option value="25">25<\/option>'+ 
                       '<option value="50">50<\/option>'+ 
                       '<option value="100">100<\/option>'+ 
                       '<option value="-1">All<\/option>'+
                       '<\/select> records' }, "iDisplayLength": -1, }); 
new FixedHeader( oTable);

元のヘッダーの上にフローティング ヘッダーが作成されました。ヘッダーの背景は透明で、既存のヘッダーとはフォントとスタイルが異なります。フローティング ヘッダーが現在のヘッダーに重なっていると、非常に奇妙に見えます。

CSS コード:

table.display thead th {
    padding: 3px 18px 3px 10px;
    border-bottom: 1px solid black;
    font-weight: bold;
        cursor: pointer;
}

table.display tfoot th {
    padding: 3px 10px;
    border-top: 1px solid black;
    font-weight: bold;
}

table.display tr.heading2 td {
    border-bottom: 1px solid #aaa;
}