原生js滚动插件(原创)

所属分类:UI-滚动

 6885  56  查看评论 (0)
分享到微信朋友圈
X
原生js滚动插件(原创) ie兼容8

更新时间:2021-03-08 21:55:16

更新说明:修改scrollbox设置百分比高度bug,添加高度未超出时,不显示滚动条的逻辑


更新时间:2021-02-07 23:09:39

使用方法

第1步:引入css、js 

第2步:创建4层节点 

<div id="scrollbox"><div><div>
    <div class="list">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
    ...
    </div>
</div></div></div>

第3步:如果是纵轴滚动,设置最大高度或高度,

overflow: hidden;#scrollbox {
    max - height: 600 px;
    overflow: hidden;
}

第4步:创建滚动轴对象

var oScrollbar = new TScrollBar('#scrollbox');

如果是横轴滚动,需要初始化时设置宽度

var oScrollbar = new TScrollBar('#scrollbox', {
    direction: 'horizontal',
    width: 1000
});
相关插件-滚动

jQuery滚轮控制轮播图上下切换(原创)

jQuery滚轮控制轮播图上下切换,简单实用
  滚动
 40375  341

jQuery全屏滚动插件,带箭头点击

一款功能齐全的全屏滚动插件,符合绝大部分开发人员的需求,没有滚动循环,无需做过多更改就能满足您的要求。
  滚动
 19573  217

仿百度知道(滚动固定标题)插件

仿百度知道滚动固定标题,点击标题滚动到内容块
  滚动
 25264  370

css3页面鼠标纵向滑动效果

css3页面鼠标纵向滑动效果
  滚动
 64773  483

讨论这个项目(0)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复