Android::Webview移除了一个DIV的滚动条

Question

我制作了一个带有可滚动div的小网页。 在浏览器中加载它时，一切正常。 但是当我在Android内部的webview中加载它时，它不允许我滚动div。 是否有解决方法或者我需要使用不同的设计？ 我说的是像这样的网站。

- Legend

Answer 1

很遗憾，大多数当前移动Webkit浏览器都不支持可滚动的div。一个很好的替代方案是iScroll Javascript库，它可以模拟真正的滚动：http://cubiq.org/iscroll。从该页面上的项目描述中复制/粘贴如下：移动Webkit的overflow:scroll。这个项目的起因是因为iPhone的webkit没有提供一种在固定大小（宽度/高度）的div内滚动内容的本地方法。所以，基本上无法同时拥有固定的页眉/页脚和一个滚动的中央区域。直到现在。版本3.3及以上支持Android >=1.5。

- David Snopek

---

水平滚动不起作用，只能垂直滚动。 - UMAR-MOBITSOLUTIONS

Answer 2

你可以使用Webkit的伪元素来自定义滚动条样式。

尝试以下代码：

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

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

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

::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255,0,0,0.4); 
}

- Verdigrass

---

感谢您的确认。 - Verdigrass

曾经使用 Nexus 工作正常，但在 Samsung Galaxy 上无法工作。有任何想法吗？ - Mrunal

可能是因为使用了不同版本的WebKit/Blink？也许版本太旧了。@Mrunal - Verdigrass

两个设备都使用相同的Android操作系统版本 - 牛轧糖。 - Mrunal

我相信这个解决方法只适用于由Webkit驱动的WebView。自从WebView转移到Chromium渲染后，它就不再起作用了。 - RandomEngy

Answer 3

更新（因为这是“webkit scrollbar android”搜索结果之一）：
我相信从Honeycomb开始，Android支持overflow:scroll。在iOS5+和BlackBerry Playbook上也跨平台支持。
我没有特别测试过webview，但我认为由于它在原生浏览器中得到支持，所以在webview中也应该得到支持。

- ABBDVD