iOS 5 webkit上的自定义滚动条无法正常工作

Question

我有一个内部div应该滚动的网页。这在IOS5中运行良好，但是当我自定义滚动条仍然看到原生的滚动条？

1. 使用自定义滚动条时如何删除原生滚动条？
2. 自定义滚动条似乎也只是在滚动完成后更新，如何在拖动div时滚动它们？

我尝试了什么：

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

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

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

Answer 1

你必须删除 -webkit溢出滚动：触摸; 禁用该原生滚动

试试这个：

.webkitScrollClass {
    overflow-y:auto;
    overflow-x:hidden;
}

.webkitScrollClass::-webkit-scrollbar {
   -webkit-appearance: none;
}

.webkitScrollClass::-webkit-scrollbar:vertical {
    width: 6px;
}

.webkitScrollClass::-webkit-scrollbar:horizontal {
    height: 6px;
}

.webkitScrollClass::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: rgba(0, 0, 0, .3);
}