有沒有辦法在使用鼠標滾輪時使瀏覽器的滾動量保持一致？

Question

我在div中有一個表，CSS屬性overflow-y設置為滾動。 當我用鼠標滾輪滾動表格一個增量（即點擊一下鼠標滾輪）時，桌面會在Firefox和Chrome中滾動不同的數量。 但是，如果我單擊滾動條滑塊下方的區域，則表格會在兩個瀏覽器中滾動相同的數量。 下面是一個演示此行為的示例： https ： //jsfiddle.net/rgxb6dz6/3/

HTML

<body>
    <div id='container'>
        <table id='table'>
        </table>
    </div>
</body>

CSS

table {
    border: 1px solid gray;
    border-collapse: collapse;
    font-family: sans-serif;
    font-size: 12px;
    margin: 2px;
    table-layout: fixed;
    width: 99%;
}

td {
    border: 1px solid gray;
    overflow: hidden;
    padding: 2px;
    white-space: nowrap;
    text-align: right;
}

th {
    border: 1px solid gray;
    overflow: hidden;
    padding: 2px;
}

#container {
    overflow-y: scroll;
    height: 200px;
    width: 200px;
    border: 1px solid black;
}

JavaScript的

$(function() {
    for(i = 0; i < 100; i++) {
        var tr = $('<tr>');
        var td = $('<td>' + i + '</td>');
        $(tr).append(td);
        for(j = 0; j < 5; j++) {
            td = $('<td>' + Math.round(Math.random() * 10000) + '</td>');
            $(tr).append(td);
        }
        $('#table').append(tr);
    }
});

有沒有辦法控制表格在使用鼠標滾輪時滾動多少以使其在瀏覽器中保持一致？

Answer 1

是的，有一種方法，但它不是那么容易，你需要發揮創意。

你需要：

聆聽任何觸發滾動的事件（鼠標滾輪，頁面翻頁，向下翻頁，鍵盤箭頭..）
阻止事件實際滾動內容
確定滾動方向（這是不容易的，因為你阻止了它，因此檢測用戶的意圖並不容易）
如果你知道用戶的意圖，你可以按代碼滾動區域（正文或其他），固定數量的單位（例如px ）

有沒有辦法在使用鼠標滾輪時使瀏覽器的滾動量保持一致？

問題描述

1 個解決方案

解決方案1
0 2016-12-06 13:54:49

你需要：

有沒有辦法在使用鼠標滾輪時使瀏覽器的滾動量保持一致？

問題描述

1 個解決方案

解決方案1 0 2016-12-06 13:54:49

你需要：

解決方案1
0 2016-12-06 13:54:49