Question

我正在尝试将自定义样式应用于滚动条（实际上，尝试使滚动条始终可见）和保留iOS应用程序的动量滚动：

#container
{
    height: 400px;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
}

#container::-webkit-scrollbar
{
    -webkit-appearance: none;
    background-color: #000;
}

#container::-webkit-scrollbar:horizontal
{
    height: 6px;
}

#container::-webkit-scrollbar-thumb
{
    background-color: #000;
}

#container::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #333;
}

但-webkit-overflow-scrolling: touch和::-webkit-scrollbar样式无法协同工作。 StackOverflow上已经有一个相关的问题：

-webkit-overflow-scrolling: touch breaks my -webkit-scrollbar css in iOS

因此，从2016年春天的高峰开始，有什么方法可以在滚动条的同时设置滚动条的样式吗？如果有另一种方法可以伪造它，我准备放弃-WebKit-overflow-scrolling: touch。

请不要建议使用niceScroll，iScroll等 - 我试过这些;实际上，我目前正在使用其中一个这样的脚本，并希望摆脱它。

Answer 1

正如上面链接的线程中所述，-webkit-overflow-scrolling: touch与您的-webkit-scrollbar属性不兼容。如果您不想下载第3方滚动条，则必须编写一些自定义JS以获得所需的功能。

iOS：任何方法使-webkit-overflow-scrolling和:: - webkit-scrollbar一起工作？

1 个答案: