在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称:x-scrollbar开源软件地址:https://gitee.com/xujz520/x-scrollbar开源软件介绍:x-scrollbar 自定义滚动条概述这是一个自定义滚动条插件. 在现代前端环境下为什么还需要它, 它有什么特点:
文档与示例https://xujz520.gitee.io/x-scrollbar/example.html 支持环境
安装直接在浏览器中使用<link rel="stylesheet" href="./xscrollbar.css"> <script src="./xscrollbar.js"></script> CDN <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/x-scrollbar/xscrollbar.css"> <script src="https://cdn.jsdelivr.net/npm/x-scrollbar/xscrollbar.js"></script> 通过npm安装npm i x-scrollbar --save
import XScrollbar from 'x-scrollbar'; 基础示例<!-- 容器 --><div id="container" style="width: 300px; height: 300px; overflow: auto; border: 1px solid #000;"> <!-- 内容 --> <table></table></div><script> let $container = document.getElementById('container'); let xscrollbar = new XScrollbar($container);</script> 常用API(与原生无异)// 读取$container.scrollLeft$container.scrollTop// 设置$container.scrollLeft = 100$container.scrollTop = 100// 监听滚动$container.addEventListener('scroll', function() { //...}) |
2023-10-27
2022-08-15
2022-08-17
2022-09-23
2022-08-13
请发表评论