首页 > 解决方案 > 修复 IE 11 中的表头

问题描述

我有一个功能可以让我在滚动时保持表格的 TH 固定。在谷歌浏览器中不存在这个问题,因为它工作得很好

在此处输入图像描述

但我有兴趣让它在 IE11 中工作但它看起来像这样:

在此处输入图像描述

我能做些什么来解决这个问题吗?

我正在与:

表代码:

    <div class="tableFixHead">
<table style="margin-left:auto; margin-right:auto;">  
    <thead>
    <tr>   
        <th>STATUS</th>  
        <th>EMP #</th>  
        <th>TYPE</th>  
        <th>NAME</th>  
        <th>LEADERS</th>  
        <th>DEPARTMENT</th>  
        <th>TEAM / PART</th>
        <th>SERIAL</th>
        <th>FA</th>
        <th>SECURITY</th>
        <th>BRAND</th>
        <th>MODEL</th>  
        <th>YEAR</th>
        <th>MONTH</th>
        <th>PRICE</th>
        <th>DATA DESTRUCTION</th>
        <th>LOCATION</th>   
    </tr>   
  </thead>
@foreach (var item in Model) {  
    <tbody>
        <tr>  
            <td>@Html.DisplayFor(modelItem => item.HW_STATUS)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_ASSIGN)</td>  
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_TYPE)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_ASIGN_NAME)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_LEADERTYPE)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_DEPT)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_DEPTEAM)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_SERIAL)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_FA_TAG)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_SECURITY_TAG)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_BRAND)</td>     
            <td>@Html.DisplayFor(modelItem => item.HW_MODEL)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_YEAR)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_MONTH)</td>
            <td>$@Html.DisplayFor(modelItem => item.HW_PRICE)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_DATA_DESTRUCTION)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_LOCATION)</td>  
            <td>@Html.ActionLink("Edit", "LaptopInventoryEdit", new { id = item.ID})</td>         
        </tr>  
    </tbody>
}    
</table>
</div>

jQuery代码:

    $(document).ready(function () {
var $th = $('.tableFixHead').find('thead th')
$('.tableFixHead').on('scroll', function () {
    $th.css('transform', 'translateY(' + this.scrollTop + 'px)');
    });
    });

标签: javascriptjquerycss

解决方案


推荐阅读