限制 HTML 表格在 iPad 中向一个方向滚动答案

【问题标题】：Restricting an HTML table to scroll in one direction in iPad限制 HTML 表格在 iPad 中向一个方向滚动
【发布时间】：2014-02-05 19:41:14
【问题描述】：

我有一个基本的 HTML 表格，宽度和高度都受到限制，因此它可以垂直和水平滚动。

一切正常，但在 iPad 上，用户可以向各个方向（包括对角线）滚动。这不是很好。我想一次限制滚动到一个方向。 HTML/CSS/JS/jQuery 可以吗？插件很好。

我也在为表格使用 KendoUI Grids，如果这有什么不同的话。

<table>
    <tr>
        <td>Some code so I can post JS Fiddle link</td>
    </tr>
</table>

【问题讨论】：

【解决方案1】：

您可以通过在代码中添加 overflow-x:hidden; 来使用纯 CSS 来实现。这完全禁用了左/右滚动。

#restricted {
    width: 400px;
    height: 300px;
    border: 1px solid red;
    overflow-x: hidden;  
}

如果您想以编程方式启用/禁用滚动，您可以使用 jQuery 来实现；

$("#restriceted").css("overflow-x","hidden");
// Restricting to only up/down scroll

【讨论】：