jquery 滚动条插件nanoScroller 的用法
scroller 插件nanoScroller 用法
默认滚动条是不是很丑,你可以他进行美化但是兼容性有问题,api是不是不够强大,自己用div做一个滚动条成本太大,这里给你推荐一款jquery 插件nanoscroller ,网上关于nanoscroller 的介绍不太多,github上有代码但是没有demo,使用其实很简单,但是还是稍微介绍一下减少学习的成本,
引入的类库 jquery.nanoscroller.js
引入的css库nanoscroller.css
<div id="about" class="nano"> <div class="nano-content"> ... content here ... </div> </div>
content 里边放置内容,请注意内层的nano-content 不要丢失,控件内部默认的在这个节点下查询,
$(".nano").nanoScroller({ scroll: 'top' }); $(".nano").nanoScroller({ scroll: 'bottom' }); $(".nano").nanoScroller({ scrollTop: value }); $(".nano").nanoScroller({ scrollBottom: value }); $(".nano").nanoScroller({ scrollTo: $('#a_node') });
更简单的方式那就直接使用我的示例代码吧