| 组件 | 自定义滚动条组件 | ||||
| 功能说明 | 基于jQuery的美化滚动条的插件，其特点如下： 1、可以自定义滚动条的任何样式； 2、当移入指定区域时滚动条才出现 |
||||
| 使用说明 | 1.引入如下js文件 <script type=”text/javascript” src=”/js/ecology8/jNice/jNice/jquery.jNice_wev8.js”></script> <link rel=”stylesheet” href=”/js/ecology8/jNice/jNice/jNice_wev8.css” type=”text/css” /> |
||||
| 2、按如下格式编写代码： 在页面上定义两个div，如下： <div id=”scrollcontainer” style=”overflow:hidden;height:300px;”> <div style=”height:100%;”>..content..</div> </div> <script type=”text/javascript”> |
|||||
| 运行效果图 | |||||
|
|||||
| 例子 | 例子：http://192.168.4.44:8080/docs/category/DocMainCategory.jsp | ||||
| API | http://noraesae.github.io/perfect-scrollbar/ | ||||
| 组件初始化参数 | 是否必须 | 类型 | 描述 | ||
| 对组件提供了以下功能函数 | |||||
| 方法2 | 返回类型 | 描述 | |||
| jQuery(“scrollcontainer”).perfectScrollbar() | 无 | 创建、更新、销毁滚动条 | |||
| 方法参数 | 是否必须 | 类型 | 描述 | ||
| options | 否 | string | update|resize：更新滚动条； destroy|remove： 销毁滚动条； getScrollObj：得到滚动条对象； getScrollTop：得到滚动条的top值； hide：隐藏滚动条； show：显示滚动条； toggle：显示/隐藏滚动条； |
||
| json | cursorwidth:8, //滚动条宽度 cursorborder:”none”, //滚动条是否有边框 cursorcolor:”#999″, //滚动条颜色 hidecursordelay:0, //滚动条隐藏延迟时间，0表示不延迟 zindex:10001, //滚动条的z-index horizrailenabled:false //是否需要横向滚动条 |
||||
转载请注明：赫非域 » ecology开发之自定义滚动条组件