【问题标题】:iOS Scroll Inertia and Scroll Bar with HTML TableiOS 滚动惯性和带有 HTML 表格的滚动条
【发布时间】:2019-11-21 12:07:35
【问题描述】:

我制作了一个带有固定左列的HTML 表(代码是SO 上另一篇文章的简化版本)。当我在 iOS 模拟器上查看时,表格的右半部分可以正确滚动,但是,它没有显示滚动条,也没有惯性滚动。

表格示例:http://jsfiddle.net/jakechasan/94aP4/

这是基本代码:

HTML:

<div id="tableContainer">
    <table>
        <tbody>
            <tr>
                <td class="leftColumn">Row 1</td>
                <td>efhiubcebucefbuiceguceuceiuceuceu0v8cev8ceserybewqbyuqw0uqr0</td>
            </tr>
        </tbody>
    </table>
</div>

CSS:

    #tableContainer {
        width: 200px;
        overflow-x:scroll;
        margin-left:5em;
        overflow-y:visible;
        padding-bottom:1px;
        background-color: yellow;
    }
    table {
        border-collapse:separate;
        border-top: 3px solid grey;
    }
    td {
        margin:0;
        border:3px solid grey;
        border-top-width:0px;
        white-space:nowrap;
    }
    .leftColumn {
        position:absolute;
        width:5em;
        left:0;
        top:auto;
        border-right: 0px none black;
        border-top-width:3px;
        /*only relevant for first row*/
        margin-top:-3px;
        /*compensate for top border*/
    }

有人知道如何激活惯性滚动,并显示滚动条吗?

【问题讨论】:

    标签: html ios css scroll


    【解决方案1】:

    我通过以下方式解决了这个问题:

    -webkit-overflow-scrolling: touch; //adding this line will enable inertial scrolling
    

    来源:http://cooshtee.com/blog/2012/11/add-inertial-scrolling-to-a-fixed-height-div-in-ios/

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-01-27
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多