使溢出滚动条在 iOS 和 Android 移动设备上可见答案

【问题标题】：Make overflow scroll bar visible on iOS and Android mobile使溢出滚动条在 iOS 和 Android 移动设备上可见
【发布时间】：2019-04-21 01:34:35
【问题描述】：

如何使溢出滚动条在移动设备上可见？滚动条在桌面上可见，但在移动设备上不可见。我需要它在 iPhone 和三星上显示。 Safari浏览器也是如此。这甚至可能吗？

这就是我现在所拥有的。

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(77, 168, 65, 1); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(77, 168, 65, 1); 
}

【问题讨论】：

How do I get scrollbars to show in Mobile Safari?的可能重复
@ItayGal 请不要将我重定向到 8 年前的帖子。该信息甚至不再起作用。我看过那个帖子并测试过。不工作。
一个月前它对我有用，没有理由两次回答同一个问题
@ItayGal，我需要强制它在移动设备上显示。不是桌面。这些答案都是针对桌面视图的。我还需要让滚动条在移动视图上始终可见。如果那个帖子对你有帮助。然后通过帮助实施一个月前对您有用的方法来回答我的帖子。
仔细阅读：这是手机版-webkit-overflow-scrolling: touch

标签： android jquery html ios css

【解决方案1】：

Apple 有意识地决定在系统级别隐藏 iOS 中的滚动条，直到发生交互。 Mac OS（包括 Safari）和 Android 很快就做出了这个决定。

据我所知，只有最终用户可以覆盖此设置及其系统全局设置。

How do I get scrollbars to show in Mobile Safari 中讨论的寻找库来重建滚动条的建议仍然是最佳解决方案。

也就是说，在尝试在移动设备上强制滚动条之前，我会有一个非常好的理由。用户被训练成不需要它们，他们在已经很小的屏幕上占用了毫无意义的空间。

【讨论】：