jQuery自定义滚动条插件scrollBar.js

所属分类:UI-滚动

 3838  13  查看评论 (2)
jQuery自定义滚动条插件scrollBar.js ie兼容8

代码注释很全,可通过简单的修改样式来改变滚动条外观。

滚动条内容、滚动条、滚动滑块的样式类名

contentSelector: '.scroll_cont', //滚动内容区
barSelector: '.scroll_bar', //滚动条
sliderSelector: '.scroll_slider' //滚动滑块

如果想自己设定滚动条滑块高度,请将scrollBar.js内的

// 获取内容来定义滑块的高度
this._initSliderHeight();
// 根据内容来定义滑块的高度
    _initSliderHeight: function() {
     var rate = this.$cont.height()/this.$cont[0].scrollHeight;
     var sliderHeight = rate*this.$bar.height();
     this.$slider.css('height',sliderHeight);
},

注释掉

相关插件-滚动

CSS3 滚动视觉差效果加返回顶部

CSS3 滚动视觉差效果+返回顶部.
  滚动
 19147  106

jQuery上下左右滚动插件rollSlide.js

实现上下左右自动滚动、无缝滚动
  滚动
 27317  184

jquery模拟滚动条(未封装)

jquery模拟滚动条,支持自定义滚动条样式,兼容pad,web手机端未测试;支持同一网页多个滚动条;支持添加和删除(本人对封装不太了解,未封装)
  滚动
 16496  43

jQuery仿京东楼层滑动侧边栏高亮(原创)

jQuery模仿京东侧边栏点击滑动到该楼层,同时侧边栏随着页面滚动对应导航高亮。
  滚动
 10420  70

讨论这个项目(2)回答他人问题或分享插件使用方法奖励jQ币

    经历过痛楚的人才知道珍惜 0
    2018/12/5 16:24:29
    如果一个页面有几个地方都有这个滚动条怎么办?
        0
        2019/1/11 15:46:15
        复制改名呗
    回复
取消回复
  短信接口