码迷,mamicode.com
首页 > 其他好文 > 详细

滚动条插件

时间:2016-11-25 12:13:32      阅读:168      评论:0      收藏:0      [点我收藏+]

标签:不同的   背景   轨迹   text   idt   str   边框   设置   元素   

1.使用slimscroll插件

演示网址http://www.jq22.com/yanshi1425
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.slimscroll.min.js"></script>
$(‘#testDiv2‘).slimscroll({
  height: ‘100px‘,
  width: ‘300px‘
});
$(‘#testDiv‘).slimscroll({
  size: ‘15px‘
});
基本参数设置:
width:‘100px‘,//容器宽度,默认无
height:‘100px‘,//容器高度,默认250px
size:‘10px‘,//滚动条宽度,默认7px
position:‘left‘,//滚动条位置,可选值:left,right,默认right
color:‘#abc‘,//滚动条颜色,默认#000000
alwaysVisible:true,//是否禁用隐藏滚动条,默认false
distance:‘10px,‘//距离边框距离,位置由position参数决定,默认1px
start:‘.p‘,//滚动条初始位置,可选值top,bottom,$(selector)--内容元素位置,默认top
wheelStep:‘12px‘,滚动条滚动值,默认10px
railVisible:true,//滚动条背景轨迹,默认false
railColor:‘#005612‘,//滚动条背景轨迹颜色,默认#333333
railOpacity:0.8,//滚动条背景轨迹透明度,默认0.2
allowPageScroll:true,//滚动条滚动到顶部或底部时是否允许页面滚动,默认false
scrollTo:‘50px‘,//跳转到指定的滚动值。可以呼吁任何元素slimScroll已经启用了吗(没试过)
scrollBy:‘50px‘增加/减少当前滚动值由指定的数量(正面或负面)。可以呼吁任何元素slimScroll已经启用(没试过)
disableFadeOut:true,//是否禁用鼠标在内容处一定时间不动隐藏滚动条,当设置alwaysVisible为true时该参数无效,默认false
touchScrollStep:1000,//可以设置不同的触摸滚动事件的敏感性。负数反转方向滚动,默认200



滚动条插件

标签:不同的   背景   轨迹   text   idt   str   边框   设置   元素   

原文地址:http://www.cnblogs.com/ayyayy/p/6100763.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!