滚动阴影

当内容在滚动时溢出时应用顶部和底部阴影效果。

Storybook@heroui/scroll-shadowSourceStyles source

安装

The above command is for individual installation only. You may skip this step if @heroui/react is already installed globally.

导入

用法

隐藏滚动条

你可以使用 hideScrollBar 属性来隐藏垂直和水平滚动条。

自定义阴影尺寸

默认的阴影尺寸为 40 像素，但你可以使用 size 属性来更改它。

水平方向

如果你需要在水平滚动时应用阴影，可以将 orientation 属性设置为 horizontal。

阴影偏移量

默认的阴影偏移量为 0 像素，但你可以使用 offset 属性来更改它。这允许你在特定位置应用阴影。

API

ScrollShadow 属性

PropTypeDefault
size
number
"40"
offset
number
"0"
hideScrollBar
boolean
false
orientation
horizontal | vertical
"vertical"
isEnabled
boolean
true
visibility
ScrollShadowVisibility
"auto"

ScrollShadow 事件

PropTypeDefault
onVisibilityChange
(visibility: ScrollShadowVisibility) => void

类型定义

滚动阴影可见性

Range Calendar 范围日历Select 下拉选择