javascript - 怎么设置鼠标滚轮默认滚动方式为横向？

Question

如何让鼠标滚轮默认滚动方式为横向。列表是横向显示的，需要按住shift才能横向滚动。

使用js监听滚轮事件修改X轴滚动条实现，但是不太流畅

function onscroll(event){  let left = -event.wheelDelta || event.deltaY / 2;  console.log(event, templateListRef.value);  templateListRef.value.scrollLeft = templateListRef.value.scrollLeft + left;}

Answer 1

将容器旋转-90deg，子元素旋转90deg。

https://stackoverflow.com/a/39573512

Answer 2

您的问题是关于如何改变鼠标滚轮的默认滚动方式，使其变为横向滚动，对吧？

首先，需要明确的是，鼠标滚轮的默认滚动方式是由操作系统和浏览器决定的，通常情况下是不能修改的。这是为了防止用户在不同的应用程序中遇到不兼容的情况。

然而，如果你是在一个特定的网页或应用中，你可以使用JavaScript来监听滚轮事件，并改变滚动条的滚动方式。这可以通过获取元素并更改其scrollLeft属性来实现。

以下是一个示例代码：

function onscroll(event) {  let left = -event.wheelDelta || event.deltaY / 2;  console.log(event, templateListRef.value);  templateListRef.value.scrollLeft = templateListRef.value.scrollLeft + left;}

这个函数会在滚动事件发生时被调用，然后根据滚动的方向来改变滚动条的滚动位置。但是，这种方法可能会引起滚动动画的不流畅。这是因为当滚动的方向改变时，浏览器需要重新计算元素的scrollLeft值，这可能会导致短暂的滚动停止或跳跃。

如果你正在开发一个网页或应用，并且希望用户能够以不同的方式滚动内容，我建议你考虑使用可定制的滚动条库，比如perfect-scrollbar或者simplebar等。这些库可以让你有更多的控制权，比如改变滚动条的样式、大小、位置等，甚至可以自定义滚动的行为。