在公司的一个小项目中，需要从后台获取一大堆数据，为了用户体验的考虑，需要分部加载，然后就在网上找了很多的滚动插件，终于找到一个合适的。mCustomScrollbar插件地址 点击这里
它有各种各样的样式，引入它的 js 和 css ，例如：
<link rel="stylesheet" href="/path/to/jquery.mCustomScrollbar.css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="/path/to/jquery.mCustomScrollbar.concat.min.js"></script>
然后可以在 html 里面直接调用，例如：
<div class="classname mCustomScrollbar" data-mcs-theme="minimal-dark"> </div>
其中 classname 是你自己给这个 div 一个样式，比如设置这个 div 的高度等，minimal-dark 是它其中的一个样式，可以在它的 jquery.mCustomScrollbar.css 中修改它的样式，比如滚动条的宽度和颜色等。
如果要实现滚动获取数据，就不能直接在 html 里直接调用，需要在<script></script>标签里调用它，例如：
<script type="text/javascript"> $(".classname").mCustomScrollbar({ theme:"minimal-dark" }); </script>
这个和上面 html 直接调用效果是一样的。
然后使用它的一个回调函数 whileScrolling，例如：
$(".classname").mCustomScrollbar({
theme: ‘minimal-dark‘,
callbacks: {
whileScrolling: function(){ // 只要滚动条滚动，这个函数就会执行
if (this.mcs.topPct >= 90) { // 这表示当滚动条滚动到这个div的90%(当然这个值是可变的)的时候调用下面的代码，
$.ajax({
// 用ajax去后台获取数据，并把数据添加到这个div里
})
}
}
}
})
用 mCustomScrollbar 滚动条插件实现滚动更新添加数据
原文：http://www.cnblogs.com/LY-leo/p/5750059.html