Basic configuration
1 | $(selector).slimScroll(); |
Example of additional settings
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | $( function () { $( ".slimscroll" ).slimScroll({ width: 'auto' , //可滚动区域宽度 height: '100%' , //可滚动区域高度 size: '10px' , //组件宽度 color: '#000' , //滚动条颜色 position: 'right' , //组件位置:left/right distance: '0px' , //组件与侧边之间的距离 start: 'top' , //默认滚动位置:top/bottom opacity: .4, //滚动条透明度 alwaysVisible: true , //是否 始终显示组件 disableFadeOut: false , //是否 鼠标经过可滚动区域时显示组件,离开时隐藏组件 railVisible: true , //是否 显示轨道 railColor: '#333' , //轨道颜色 railOpacity: .2, //轨道透明度 railDraggable: true , //是否 滚动条可拖动 railClass: 'slimScrollRail' , //轨道div类名 barClass: 'slimScrollBar' , //滚动条div类名 wrapperClass: 'slimScrollDiv' , //外包div类名 allowPageScroll: true , //是否 使用滚轮到达顶端/底端时,滚动窗口 wheelStep: 20, //滚轮滚动量 touchScrollStep: 200, //滚动量当用户使用手势 borderRadius: '7px' , //滚动条圆角 railBorderRadius: '7px' //轨道圆角 }); }); |
slimScroll publishes slimscroll event when scrollbar reaches top or bottom of the parent container. You can use jQuery bind method to subscribe to this event:
1 2 3 | $(selector).slimScroll().bind( 'slimscroll' , function (e, pos){ console.log( "Reached " + pos"); }); |
特别申明:
本站所有资源都是由网友投稿发布,或转载各大下载站,请自行检测软件的完整性!
本站所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!
如有侵权请联系我们删除下架,联系方式:lei1294551502@163.com