咨询WheelEvent的delta*值与内容滚动方向不符的触发条件

以下几种情况会导致wheel事件中的delta*值（deltaX、deltaY、deltaZ）和内容实际滚动方向不匹配：

• 系统/浏览器的滚动方向反转设置
  很多操作系统（如macOS、Windows）或浏览器支持“自然滚动”这类反转滚轮方向的设置。比如默认情况下，滚轮向下滚动时deltaY为正值，页面内容向下滚动；开启自然滚动后，滚轮向下滚动deltaY变为负值，但页面内容依旧向下滚动，此时deltaY的方向就和实际滚动方向不一致。

• 自定义滚动逻辑的干预
  当开发者通过JavaScript监听wheel事件，调用preventDefault()阻止浏览器默认滚动行为，然后实现自定义的滚动逻辑时，delta*值的方向可能和最终的滚动行为完全相反。比如监听wheel事件后，拿到deltaY为正值，却让页面元素向上滚动，这就会出现delta值与实际滚动方向不匹配的情况。

• CSS样式导致的视觉滚动方向反转
  如果给滚动容器设置了反转视觉方向的CSS样式，比如transform: scaleY(-1)（垂直滚动反转）或direction: rtl（水平滚动反转），页面实际的视觉滚动方向会被反转，但delta*值仍然遵循原生的规则，从而导致两者方向不一致。比如水平滚动场景下，默认deltaX为正值时页面向右滚动，设置direction: rtl后，deltaX为正值页面却向左滚动。

• 外设或自定义输入映射
  部分特殊外设（如游戏鼠标、定制触控板）的滚轮输入逻辑可能偏离标准，或者用户自定义了设备的滚轮映射规则，这会导致delta*值的方向和实际触发的滚动方向不匹配。

内容的提问来源于stack exchange，提问作者L.Blondy