Slider 设计文档

在连续/离散区间内选值的滑块,支持单值与 range、刻度、垂直方向与全键盘操作。

← API 文档

使用建议

在连续/离散区间内选值的滑块,支持单值与 range、刻度、垂直方向与全键盘操作。

Accessibility

ARIA role:slider

  • 根容器 role=group,每个手柄 role=slider + tabindex=0
  • 手柄 aria-valuemin/valuemax/valuenow/aria-orientation
  • range 模式两手柄不交叉(越过自动交换)
  • 拖拽命令式:pointerdown 读一次 rail rect,document 监听 pointermove/up
  • disabled→aria-disabled,手柄 tabindex=-1
  • aria-valuetext 优先 getAriaValueText,其次 tipFormatter 输出(带单位可读文案)
  • 数值气泡:hover/focus/拖拽显示,alwaysShowTip 常驻,tooltipVisible 强制受控

设计变量

变量默认值用法
--cd-slider-handle-transition-duration var(--cd-motion-duration-fast)滑块手柄阴影过渡时长(组件消费)
--cd-slider-handle-transition-easing var(--cd-motion-ease-standard)滑块手柄阴影过渡曲线(组件消费)