表头已修复，无法使用触控设备

Question

我已经实现了页面中间的表格，滚动时固定了表格标题。它适用于所有浏览器，但不适用于触摸设备（移动设备）。由于在触摸设备中滚动完成时应用固定标头，因此会出现问题。

有任何想法可以消除触摸设备（iphone，ipad）的抖动吗？

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();
    }
});

body { 
    height: 1000px; 
    font-size:20px;
}
#header-fixed { 
    position: fixed; 
    top: 0px; 
    display:none;
    background-color:red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Here is some content</h1>
<table id="table-1">
    <thead>
        <tr>
            <th>Col1</th>
            <th>Col2</th>
            <th>Col3</th>
        </tr>
    </thead>
    <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>
    </tbody>
</table>
<table id="header-fixed"></table>