iOS PhoneGap jQuery Mobile App 中的可见滚动条

Posted 2023-03-15

技术标签:

【中文标题】iOS PhoneGap jQuery Mobile App 中的可见滚动条【英文标题】：Visible Scrollbar in iOS PhoneGap jQuery Mobile App 【发布时间】：2012-11-18 22:21:24 【问题描述】：

我第一次使用 JQueryMobile + PhoneGap 开发 iPhone 应用程序。我有一个 div 容器，它的作用就像一个弹出窗口，我给它一个最大高度，带有溢出：自动和 -webkit-溢出滚动：触摸。

我想让滚动条始终可见并尝试了这个 css 规则（为了测试，我在元素和全局样式上都使用了相同的 psedu。但不确定它是否可以这样工作！）..

.info-wrapper-content::-webkit-scrollbar, ::-webkit-scrollbar 
-webkit-appearance: none;width: 8px;
height: 13px;

.info-wrapper-content::-webkit-scrollbar-thumb:vertical
height: 50px;
    background-color: #D95649;
    -webkit-border-radius: 0px;
    visibility: visible;

它在桌面 Safari 或 Chrome 上运行良好，并且始终可见！但在移动 Safari 或 Phonegap 应用程序上却不行！ Mobile Safari 是否支持 ::-webkit-scrollbar？

我真的不想使用任何额外的滚动插件，如 iScroll。有什么问题？为什么相同的代码表现不同？请给点建议。

【问题讨论】：

你用过哪个滚动条。我的应用需要帮助。 @PhoneGapDeveloper.It 也取决于 ios 版本！工作 IOS 5 但它保持可见，但不能在 IOS 6 上工作。它只在滚动上可见。我最终不得不采用 jScrollPane 使其工作。 【参考方案1】：

我认为你应该看看这个 .. 这是一个 similar question 之前有人问过..

似乎移动 safari 不支持溢出属性，因此未显示滚动条。

我确实为您找到了一个可能有帮助的链接，但我自己没有测试过，you can try it out

【讨论】：

【参考方案2】：

这些属性基本上告诉浏览器采用标准的、始终可见的滚动条并稍微调整其外观。 iOS 上根本不存在永久可见的滚动条，因此它们什么也不做。

虽然有些插件会使用常规的 html 元素创建一个假滚动条，但您真的想构建一些在 iOS 上看起来不合适的东西吗？

如果滚动条的原因只是为了告诉用户可以滚动，请尝试调整元素高度，使列表中的最后一项只有一半可见。