Scrollbar 滚动条

用于替换浏览器原生滚动条。

提示

由于使用了 ResizeObserver 请注意浏览器兼容性

基础用法

通过 height 属性设置滚动条高度，若不设置则根据父容器高度自适应

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

测试内容

横向滚动

当元素宽度大于滚动条宽度时，会显示横向滚动条。

最大高度

当元素高度超过最大高度，才会显示滚动条。

添加项目移除项目

1

2

3

4

5

可用的 css 变量

点击展开

:host {
  --ivy-scrollbar-thumb-color: var(--ivy-text-color-secondary);
  --ivy-scrollbar-color: transparent;
  --ivy-scrollbar-size: 8px;
}

Props

属性名	说明	类型	可选值	默认值
height	滚动条高度（同style中的height）	string	-	-
max-height	滚动条最大高度（同style中的max-height）	string	-	-
min-size	下划线	string	-	20px

Event

事件名	说明	参数
scroll	当触发滚动事件时，返回滚动的距离	function(x:number,y:number)

Methods

方法名	说明	类型
scrollTo	设置容器的滚动距离	function

注意

scrollTo 方法的签名：
function (val:number, isHorizontal: boolean=false):void
function (conf: {top:number, left: number}):void