Marquee
Horizontally scrolling text or elements at a constant speed; for announcement bars, tickers, and logo walls.
Basic usage
duration controls seconds per full loop; default direction is right-to-left. pauseOnHover is on by default and pauses on mouse hover.
📢 系统将于今晚 23:00 进行升级维护,预计 30 分钟 · 期间订单系统不可用 · 请提前安排
<CfMarquee :duration="20">
📢 The system will undergo maintenance tonight at 23:00...
</CfMarquee> <CfMarquee duration={20}>
📢 The system will undergo maintenance tonight at 23:00...
</CfMarquee> API
| Prop | Type | Default | Description |
|---|---|---|---|
content | string | — | Simple text content; rich content can also be passed via the default slot / children |
duration | number | 20 | Seconds per loop; smaller is faster |
direction | 'left' | 'right' | 'left' | Scroll direction |
pauseOnHover | boolean | true | Pause animation on hover |
gap | number | 40 | Pixels of whitespace between the end of content and the next loop’s start |
反馈与讨论
Marquee · Discussion