在Firefox中更改滚动条颜色并不像在Internet
Explorer和Opera中那样简单。Firefox仅允许通过主题设置滚动条的样式。这是一件好事。许多用户不喜欢界面设计师随心所欲地随意更改界面小部件的外观。对于可能使用高对比度主题的视障访客来说，更改界面部件的外观甚至可能是一个更大的问题。
就是说，如果滚动条包含在
<div>页面的内，则可以创建一个自定义滚动条并使用Javascript使其功能正常。这个jQuery插件看起来很不错
运作方式如下：
在文档的内部
<head>，我们必须引用几个样式表和脚本（您可能已经从下载了这些样式表和脚本）。
这是绝大部分魔术发生的地方：
<!-- Styles --><link rel="stylesheet" type="text/css" href="jquery.jscrollpane.css" /><style type="text/css"> html, body { height: 100%; margin: 0; padding:0; } #container { height:100%; width:100%; margin: 0; padding:0; overflow: auto; }</style><!-- scripts --><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script type="text/javascript" src="jquery.mousewheel.js"></script><script type="text/javascript" src="jquery.jscrollpane.min.js"></script><script type="text/javascript"> $(document).ready(function() { $('.scroll-pane').jScrollPane(); });</script>假设css和js文件与html文件位于同一目录中。我们首先链接到提供的样式表。
然后，添加一些CSS以防止显示正常的滚动条。设置
margin和
paddingHTML和身体为0，并设置
height为100％。我们所有的内容都将包装在一个ID为“容器”的div中。这个容器正好填满了页面（高度：100％；宽度：100％；），并且窃取了滚动内容，因此我们可以自定义滚动条（
overflow:auto;）。
然后，我们引用所有适当的脚本。在这里，我使用的是Google托管的jQuery副本，我再次假设所有本地脚本都与html文件位于同一目录中。jQuery的最后一点是使用“
scroll-pane”类查找所有div，并向其添加适当的元素和滚动功能。
html然后非常简单。
<body> <div id="container"> All of your content for the page goes here. </div></body>
如果您做对了所有事情，那么您的页面应类似于我的示例。
