html - IE 和 Firefox 中不存在滚动条自定义效果

标签 html css internet-explorer firefox webkit

我的元素需要这个滚动条(给定图片),

enter image description here我将其应用于我的 CSS

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

::-webkit-scrollbar-track {
      background-color: #FFFFFF;
} /* the new scrollbar will have a flat appearance with the set background color */

::-webkit-scrollbar-thumb {
      background-color: rgba(242,91,32,0.9); 
} /* this will style the thumb, ignoring the track */

::-webkit-scrollbar-corner {
      background-color: #FFFFFF;
}

但是当我检查我的页面时,只有 chrome 显示了 Firefox (27.0.1) 和 Internet Explorer(10for) 没有响应更改的效果。我必须添加什么才能使它们变得统一?

最佳答案

正如 N.Nihar 在评论中提到的,当前版本的 Firefox 和 Internet Explorer 不支持滚动条自定义。

如果您需要设置滚动条样式,您可能希望使用自定义 Javscript 或者更好的是基于 jQuery 的滚动条元素。第一个出现在谷歌搜索中的是 Stack Overflow answer ,或者您可以选择 Tiny scrollbar ,或来自 this list 的一个.有许多现成可用的基于 Javascript 和 jQuery 的滚动条。

不过,如果您确实使用其中之一,请务必彻底测试您的解决方案,因为“原生”滚动条的行为并不那么容易模仿。

关于html - IE 和 Firefox 中不存在滚动条自定义效果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22349929/

相关文章:

javascript - 在网页上本地存储用户输入的数据的最佳方法是什么?

html - 内部 DIV 未扩展到 100% 高度

javascript - 如何更改 Logo 大小并在向下滚动时隐藏一些 Div

javascript - 如何在 Bootstrap 3 中禁用 IE 的页面响应

javascript - jQuery :contains works in FF, Safari 和 Chrome,而不是 Internet Explorer

html - 垂直内容适合 div

javascript - 我的页面加载时是 "stuttering"。我怎样才能解决这个问题?

html - 在容器内垂直居中无花果标题

internet-explorer - IntelliJ 以无插件模式启动 Internet Explorer,这会禁用我的 gwt 插件

javascript - 如何在卡片中将我的网页分享到 Twitter