纯 CSS 实现多列不同速度滚动

Multi-Column Different-Speed Scrolling

我在构思画廊浏览体验时想到，滚动机制本身其实没那么重要，关键在于探索感。于是尝试用纯 CSS 实现多列不同速度的滚动效果：左列正常滚动，右列通过 Scroll-Driven Animations 的 scroll() 动画加速上移，甚至还能让每张图片在视口内缩放漂移。整个过程无需 JavaScript，仅靠 CSS 的 transform 和 animation-timeline 就能达成。此外，我还尝试了反向滚动方案，让右列图片在向下滚动时反而向上浮现。虽然实现细节有些繁琐，但效果令人满意，也展现了现代 Web 平台在动画能力上的进步。