body:overflow-x - 仍然可以使用触控板滚动

Question

我有一个div position: absolute设置,它只比我的浏览器窗口稍微宽一点.我已经成功隐藏了水平滚动条,但我仍然能够使用Macbook触控板滚动.

有没有办法绕过这个？

<div id="container">
    <div id="big-image"></div>
</div><!-- #container -->

#container {
    overflow-x: hidden;
}

#big-image {
    background: transparent url('/path/to/image.png') no-repeat center top;
    position: absolute;
    width: 1307px;
    left: 50%;
    margin: 0 0 0 -653.5px;
    z-index: 4;
}

Answer 1

如果你没有限制#container的高度,只需将overflow设置为hidden,因为overflow-x很奇怪,因为它删除了滚动条,但仍允许你滚动.

例

body {
    overflow-x: hidden;
}

#container {
    overflow: hidden;
    width: 100%;
}