如何在JavaScript中将Y轴滚动转换为X轴滚动？

先说说你原来代码里的几个问题：

• 事件绑定写法错误：window.addEventListener('scroll', (scrollY) ); 没有正确关联处理函数，且scroll事件的参数是事件对象，不是scrollY数值
• window.scrollY 是只读属性，无法直接赋值修改
• 逻辑方向搞反：你需要把Y轴的滚动输入转换成X轴滚动，而非将scrollX赋值给scrollY

正确的做法是监听wheel事件（该事件能直接捕获滚轮/触控板的滚动输入，比scroll事件更适合做拦截转换），阻止默认纵向滚动行为后，将滚动增量映射到横向滚动上。代码如下：

<script>
// 监听滚轮/触控板的滚动输入事件
window.addEventListener('wheel', function(e) {
    // 阻止浏览器默认的纵向滚动行为
    e.preventDefault();
    // 将Y轴滚动增量转换为X轴滚动，可通过调整乘数（如1.2）控制滚动速度
    window.scrollBy({
        left: e.deltaY * 1.2,
        behavior: 'smooth' // 可选参数，开启平滑滚动效果
    });
}, { passive: false }); // 必须设置为false，否则无法调用preventDefault
</script>

关键部分说明：

• wheel事件的deltaY属性代表纵向滚动的偏移量，正负值对应滚动方向
• e.preventDefault()用于避免页面同时触发纵向和横向滚动
• window.scrollBy实现相对当前位置的滚动，left参数控制横向滚动距离
• 若页面内有需要保留纵向滚动的元素，需给这类元素单独设置例外逻辑，避免影响正常交互

内容的提问来源于stack exchange，提问作者em.a