使用方法及使用参数
$("#id1").niceSroll("#id2",{
touchbehavior:true, //是否是触摸式滚动效果
cursorcolor:"#333", //滚动条的颜色值
cursoropacitymax:0.6, //滚动条的透明度值
cursorwidth:20, //滚动条的宽度值
background:#FF0000, //滚动条的背景色，默认是透明的
autohidemode:true, //滚动条是否是自动隐藏，默认值为 true ,表示是自动隐藏
boxzoom:true //是否显示放大镜标按钮，默认为false,表示不显示
}); <!-- start -->
<script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="/jquery.nicescroll.js"></script>
<script type="text/javascript">
$(function() {
//图片区域显示滚动效果
$("#box1").niceScroll("#box1 div", {
touchbehavior: true,
cursorcolor: "#333",
cursoropacitymax: 0.6,
autohidemode: false,
boxzoom: false
});
//div区域显示滚动效果
$("#box2").niceScroll("#content", {
cursorcolor: "#666",
autohidemode: false,
boxzoom: true
});
//iframe区域显示滚动效果
$("#box3").niceScroll("iframe", {
cursorcolor: "#ccc",
autohidemode: false,
boxzoom: true
});
});
</script>
<!-- end -->
<style type="text/css">
.bs{padding:5px;height:120px;margin:0 auto;border:1px solid #555;overflow:auto;width:380px}
</style>
<div id="container">
<!--start-->
<p>DIV里是图片</p>
<div id="box1" class="bs">
<div class="scrimg">
<img src="images/pic10.jpg" />
<img src="images/pic10.jpg" />
<img src="images/pic10.jpg" />
<img src="images/pic10.jpg" />
<img src="images/pic10.jpg" />
</div>
</div>
<p>DIV里是内容</p>
<div id="box2" class="bs">
<div id="content">
<h3>这是一个div区域</h3>
<p class="p">内容区域</p>
</div>
</div>
<p>DIV里是框架</p>
<div id="box3" class="bs">
<!--iframe 自适应高度 -->
<iframe src="http://lizhenqiu.com" height="100%" width="100%" frameborder="0" onload="$(this).height($(this).contents().height());"></iframe>
</div>
<!--end-->
</div>
附件：http://lizhenqiu.com/upload/attach/tbs-YgdxK76JMj.nicescroll.js.txt