對角線溢出滾動不適用於鉻或歌劇

Question

具有設置尺寸（常量）的容器（div），隱藏溢出（表格）。對角線滾動在firefox和Safari瀏覽器上工作正常，但Chrome和Opera不同時滾動兩個尺寸。爲什麼？

小提琴： https://jsfiddle.net/coolcatDev/kd75zyzk/1/

HTML：（爲簡單起見，只有一個行級別>無Y型溢出）

<div class="wrap"> 
<table> 
<tr> 
    <td>Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
     <td>Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
     <td>Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
     <td>Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
     <td>Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
     <td>Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
    </tr> 
    </table> 
    </div> 

CSS：

.wrap{ 
    height:300px; 
    width:300px; 
    overflow: scroll; 
} 

Answer 1

Google搜索爲你：

Firefox和Chrome爲鼠標滾輪使用兩種不同的JavaScript事件，並且delta屬性在每個中都有不同的名稱。幸運的是，有一個簡單的變通辦法，這將足以在大多數情況下：

// For Chrome 
window.addEventListener('mousewheel', mouseWheelEvent); 

// For Firefox 
window.addEventListener('DOMMouseScroll', mouseWheelEvent); 

function mouseWheelEvent(e) { 
    var delta = e.wheelDelta ? e.wheelDelta : -e.detail; 
} 

link