使用方法:
首先下载插件:http://manos.malihu.gr/jquery-custom-content-scroller/
一、HTML
引入以下文件
<link rel="stylesheet" href="/jquery.mCustomScrollbar.css" />
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery.mCustomScrollbar.concat.min.js"></script>
二、CSS
首先必须要有滚动条出现,给DIV限定高度,并指定overflow样式为auto, 这样当内容超出后就会自动出现滚动条了
<style>
.div-height {
width: 300px;
height: 300px;
overflow: auto;
}
</style>
三、初始化HTML
<div class="content" data-mcs-theme="dark">
<!-- your content -->
</div>
四、初始化JS
<script>
$(function(){
$(".content").mCustomScrollbar();
})
</script>
效果演示:http://itmyhome.com/jquery_scroller/ 官网:http://manos.malihu.gr/jquery-custom-content-scroller/