咨询：以中心为选择器的无限滚动滑块的专业名称是什么？
2026-8-18
组件名称与实现指引
这种组件的常用专业称谓是中心锁定无限滚动轮播（Center-Locked Infinite Scroller/Carousel），也有人叫它自动滚动中心选中轮播。
它和你提到的Marquee核心区别很明确：
- 传统Marquee只是无交互的内容滚动，没有选中逻辑
- 这个组件以中心位置为选中区域，滚动时会把目标元素对齐到中心，还支持无限循环滚动，通常会给中心元素加选中态反馈（比如图里的高亮效果）
实现参考方向
- 手动实现思路：
- 复制一份轮播内容，拼在原内容的首尾，滚动到边界时瞬间切换容器位置，模拟无限循环的效果
- 用JS控制自动滚动，或者监听用户点击切换，把目标元素对齐到容器中心
- 给中心位置的元素加选中样式（比如放大、高亮边框）
- 现成组件库方案：
- 原生JS：用
Swiper.js，开启centerMode、loop、autoplay这几个配置就能实现 - React：
react-slick支持centerMode+infinite+autoplay的组合配置 - Vue：
vue-awesome-swiper也有对应的centerMode、loop、autoplay参数可以设置
- 原生JS：用
内容的提问来源于stack exchange，提问作者Sebastian Rubina
相关产品推荐
相关产品推荐
