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

对角溢出卷轴不工作铬或歌剧

1 个答案: