2

我正在尝试使用 iPhone 应用程序中的 Web 内容复制 UIScrollView 的行为。将有许多与整个屏幕一样宽的等高项目，我希望用户能够水平滚动它们。想想照片应用程序之类的东西，或者类似于 Coverflow 之类的东西。内容是今天的新闻，明天的新闻，然后是昨天的新闻。

我已经编写了一堆 HTML 和 CSS 代码。每个“天”对应一个项目。这是代码（出于说明目的，我添加了边框）

<html>
<style type="text/css">
    body {
        margin-left:0px;
        margin-right:0px;
    }

    div#todayContainer {
        position:relative;
        height:250px;
        overflow-x:auto;
        -webkit-overflow-scrolling: touch;
        border:solid 1px yellow;
    }

    div#todayContent {
        position:absolute;
        left:-320px;
        width:960px;
        height:100%;
        overflow-x:auto;
        border:solid 1px blue;
    }

    .day {
        position:absolute;
        left:330px;
        width:300px;
        height:100%;
        background-color:red;
    }

    .nextDay {
        position:absolute;
        left:650px;
        width:300px;
        height:100%;
        background-color:green;
    }

    .previousDay {
        position:absolute;
        left:10px;
        width:300px;
        height:100%;
        background-color:orange;
    }
    </style>
<body>
    <div id="todayContainer">
        <div id="todayContent">
            <div class="previousDay">
                Test previousDay
            </div>
            <div class="day">
                Test
            </div>
            <div class="nextDay">
                Test nextDay
            </div>
        </div>
    </div>
</body>

运行时一切正常...

在此处输入图像描述

......如果我向右滚动一点，看起来一切都会好起来的！

在此处输入图像描述

但是当我尝试向左滚动时，这是不行的。但是由于我开启了触摸溢出滚动，我可以向左“弹跳”一点，以查看我打算在那里的内容......

在此处输入图像描述

我只是无法将它完全滚动到视图中。另外：注意底部的滚动指示器似乎认为它已经在内容的最左边。但是，我真的希望它认为它只是通过方式的 1/3 左右。

有什么帮助吗？

4

0 回答 0