html - 在 Internet Explorer 中更改滚动条

标签 html css internet-explorer scrollbar

我使用以下方法实现了所需的滚动条设计:

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

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 8px;
    background-color: #999;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: #666;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

如上图所示,这些更改当然不适用于 Internet Explorer,我暂时可以执行以下操作:

body {
    -ms-scrollbar-base-color: #999;
    -ms-scrollbar-track-color: #999;
    -ms-scrollbar-face-color: #666;
    -ms-scrollbar-arrow-color: #999;
}

我想知道是否可以在 IE 的 Chrome 上重新创建相同的设计。下面是带有滚动条的打印屏幕,第一个来自 Chrome,第二个来自 Internet Explorer。

enter image description here enter image description here

最佳答案

不幸的是,没有跨浏览器的方法来使用 CSS 设置滚动条的样式。但您可以尝试下一个 JavaScript 自定义滚动条插件(主要是 jQuery):jQuery Scrollbar , jScrollPane , mCustomScrollbar , perfect-scrollbar , slimScroll , baronNiceScroll .有更多可用的自定义滚动条,但它们的功能较少/知名度较低。

关于html - 在 Internet Explorer 中更改滚动条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27126914/

相关文章:

internet-explorer - 为什么 Internet Explorer (9) 在 UserAgent 中报告 "Mozilla"?

javascript - 在 Firefox 中使用 javascript 更改 div 的颜色

javascript - Web Worker postMessage({}) 何时返回给调用者

html - 等高列并将最后一项与底部对齐

html - 编写一个带有图标的搜索栏

javascript - 内容溢出到 div 之外

jquery - 尝试在选择框容器隐藏容器中使用滚动条

上传图片时PHP表单处理错误

javascript - Reactabular:如何改变一列的宽度? CSS 文件在哪里?

javascript - 当前url作为jquery的输入值