溢出-y无法在iPad上运行

时间:2016-02-04 13:47:10

标签: ios css css3 ipad overflow

我有一个可滚动内容的面板。它适用于所有浏览器和除了iPad之外的设备(无论我在iPad上使用什么浏览器)。

我有一个面板容器和一个面板幻灯片

.panel-container {
    position: relative;
    width:100%;
    height:100%;
    z-index:1;
}

.panel-slide {
    width:90%;
    height: 90%;
    display:block;
    position: absolute;
    z-index: 2;
    background-color: white;
    overflow-y: scroll;
    overflow-x: hidden;
}

面板幻灯片包含大量内容,因此我获得了滚动条。但是我无法在iPad上滚动。

我已经搜索了问题并尝试了-webkit-overflow-scrolling:touch,但我似乎无法深入了解它。

有什么可做的?

2 个答案:

答案 0 :(得分:1)

我不知道这是否会有所帮助,但我遇到了类似的问题,这就是我解决问题的方法。

我的问题:

我的页面有一个弹出元素,由AJAX填充,其中包含可点击链接列表。当此元素预先填充页面的其余部分时(某些页面要求列表从初始页面加载可见),它工作正常。但是,当我打开元素并填充列表时,如上所述,使用AJAX,列表不会在iOS上滚动。

据我所知,这个问题是:

在点击按钮打开列表和服务器响应填充列表之间的过渡期间,我让元素显示一些简单的文字“Loading ...”。我发现当删除它,并且元素已经从页面加载填充时,它将正常工作。似乎只要列表中的内容已经高于包含元素的高度,当列表填充时它就可以滚动。

我的决议:

我所做的是在“加载...”中过滤简单文本并将其包装在一个提示滚动的div中,如下所示:“<div style='height:1000px;'>Loading...</div>”,这似乎有效对我来说。

同样,我希望这可以帮助某人,或者如果没有,那么也许那些比我自己更有技巧的人可以告诉我们为什么这可能有用。

答案 1 :(得分:-2)

任何iPhone OS都没有滚动条。用2个手指滚动。他们使用手势而不是鼠标滚动,因此你无法在没有黑客的情况下实现这一目标。

值得一看http://iscrolljs.com/