jQuery custom content scroller自定义滚动条插件

jQuery custom content scroller一款强大的自定义滚动条插件。

使用方法如下：

1、引入jQuery库以及相应的jquery.mCustomScrollbar.concat.min.js文件和css文件jquery.mCustomScrollbar.css

<link rel="stylesheet" type="text/css" href="css/jquery.mCustomScrollbar.css">
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/jquery.mCustomScrollbar.concat.min.js"></script>

2、html结构，为要滚动的html元素设置css样式，添加class="XXX"，（注意：元素内容中必须要有溢出的块，否则就不会出现滚动条）

<div id="example" class="content">
　　<p>我与父亲不相见已二年余了，我最不能忘记的是他的背影。</p>
　　<p>那年冬天，祖母死了，父亲的差使也交卸了，正是祸不单行的日子。我从北京到徐州，打算跟着父亲奔丧回家。到徐州见着父亲，看
　　<p>.......</p>
　　<p>.......</p>
　　<p>.......</p>
　　<p>.......</p>
</div>

3、最后JS再调用一下就ok了，里面还有很多主题可以选择，theme：就是设置滚动条的主题，有"light"、"dark"、"minimal"、"minimal-dark"、"light-2"、"dark-2"、"dark-3"、"light-thick"、"dark-thick"等等多种主题样式

<script type="text/javascript">

    $(function() {
        $(window).load(function() {
            $("#example").mCustomScrollbar({
                autoHideScrollbar: true,
                theme: "dark"
            });
    });
    
</script>

官网地址http://manos.malihu.gr/jquery-custom-content-scroller/