php中文网

如何使鼠标滚轮默认横向滚动水平列表?

php中文网

横向滚动列表的巧妙方法

问题:

如何使鼠标滚轮默认横向滚动列表?列表内容水平显示,通常需要按住 Shift 键才能横向滚动。

解决方案:

使用 CSS 变换将容器旋转 -90 度,并将子元素旋转 90 度。这样一来,容器将垂直显示,子元素将水平显示,而鼠标滚轮的默认滚动方向将变为水平。

代码示例:

#container {
  transform: rotate(-90deg);
}

#container > * {
  transform: rotate(90deg);
}

注意事项:

  • 此方法仅适用于容器和子元素都具有固定宽高的列表元素。
  • 由于 CSS 变换,列表元素可能会出现重叠或其他布局问题。根据具体情况进行调整。

以上就是如何使鼠标滚轮默认横向滚动水平列表?的详细内容,更多请关注php中文网其它相关文章!