滚动相关 · 滚到哪、变到哪
横向滚动区段Horizontal scroll section
- 竖着滚横着走
- 被钉住
- 换了个方向
往下滚，这一段却横着走：一排商品卡从右往左平移过去，滚到头才继续往下。整段像被钉在屏幕上，只有内容在横向推进。
什么时候用它
横排的商品、时间轴、步骤流程、作品集用它；只有两三张卡时别用 —— 用户会觉得自己滚了半天什么都没看到。
参数
section height = total strip width · inner position sticky · translateX = −clamp(start, end, scrollY) · linear, tracks scroll 1:1
配方
横向滚动区段 → section height = total strip width · inner position sticky · translateX = −clamp(start, end, scrollY) · linear, tracks scroll 1:1
给 AI 的一句话
把这一段做成横向滚动区段：给这一节的高度设成它内容的总宽度（撑出滚动距离），里面的横排用 position: sticky 钉在视口里，再把纵向滚动量 clamp 到该节的范围后取负写成 translateX。它是跟着滚动 1:1 走的，不要加缓动。