0

我有一个使用 PhoneGap 开发的 HTML5/jQuery Mobile 应用程序。我已成功将此应用程序部署到 iOS，现在正在将其移植到 Android。

在我的 Android 设备上测试这个应用程序时，我遇到了一些奇怪的行为，这是一个运行冰淇淋三明治的三星 Galaxy S2。

我有一个包含在 div 中的元素列表，并且该 div 具有固定的高度。它还使用 CSS 属性 overflow-y: scroll 来允许移动用户滚动列表。该列表包含锚链接。像这样：

<div style="display: block; width: 320px; height: 250px; overflow-y: scroll;">
    <a href="index1.html">Link 1</a>
    <a href="index2.html">Link 2</a>
    <a href="index3.html">Link 3</a>
    <a href="index4.html">Link 4</a>
</div>

当锚链接列表仍在框的标准高度内时（即如果列表只有几个元素），它可以正常工作。您可以点击链接，它们会按预期运行。但是，当链接列表超出框的高度并且溢出-y滚动生效时，我无法再点击链接。滚动效果很好，但我无法点击滚动 div 中的任何元素！

奇怪的是，我无法对任何链接做的其他事情是使用浏览器的文本选择功能选择它们。当滚动链接太少时有可能，但当滚动处于活动状态时则不可能。

我曾假设带有 ICS 的 Galaxy S2 足够新，可以正确支持溢出滚动，但也许我错了。关于如何让它发挥作用的任何想法？我似乎在网上找不到任何关于冰淇淋三明治中的错误或对溢出-y 的支持的具体内容。

4

2 回答 2

0

您可以直接将点击事件处理程序附加到这些链接吗？使用 jQuery Mobile 链接并不像看起来那么简单。

自从您开始使用 iOS 以来，是否还有任何特定于 iOS 的 CSS？为了在 iOS 上获得良好的滚动效果，有时您必须添加 3d 变换来触发硬件加速，但这会对 android 产生一些有趣的副作用。

另一件可能值得尝试的事情是设置overflow而不是overflow-y- 它不应该有所不同，但有时会有所不同。

于 2012-12-03T04:14:29.143 回答
0

我知道这是一个老问题，但我认为该解决方案可能会有所帮助，因为它仍然在当前版本的 phonegap/cordova 中发生：

要解决此问题，您必须向固定元素添加一个转换属性，在您的情况下是主 div：

div {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0, 0, 0);
}

学分在这里

于 2015-07-10T11:10:12.280 回答