[Javascript] 检测屏幕滑动方向

要使用 JavaScript 检测屏幕滑动方向，可以监听滚动事件 (scroll) 并与前一个滚动位置进行比较来确定滑动的方向。下面是一个实现示例：

// 存储前一个滚动位置
let previousScrollPosition = window.pageYOffset || document.documentElement.scrollTop;

// 监听滚动事件
window.addEventListener('scroll', function() {
   
  // 获取当前滚动位置
  const currentScrollPosition = window.pageYOffset || document.documentElement.scrollTop;

  // 比较当前位置与前一位置，确定滑动方向
  if (currentScrollPosition > previousScrollPosition) {
   
    // 向下滚动
    console.log('向下滚动');
  } else if (currentScrollPosition < previousScrollPosition) {
   
    // 向上滚动
    console.log('向上滚动');
  }

  // 更新前一位置
  previousScrollPosition = currentScrollPosition;
});

在这个示例中，我们监听 scroll 事件，并在事件处理程序中获取当前的滚动位置和前一个滚动位置。然后，通过比较这两个位置的值，我们可以确定滑动的方向是向上还是向下。

值得注意的是，由于滚动事件的触发频率很高，上面的示例可能会在滑动过程中多次触发。如果只想在滑动结束后确定方向，可以使用 setTimeout 来添加一个延迟。

let previousScrollPosition = window.pageYOffset || document.documentElement.scrollTop;
let scrollingTimeout;

window.addEventListener('scroll', function() {
   
  clearTimeout(scrollingTimeout);

  scrollingTimeout = setTimeout(function() {
   
    const currentScrollPosition = window.pageYOffset || document.documentElement.scrollTop;

    if (currentScrollPosition > previousScrollPosition) {
   
      console.log('向下滚动');
    } else if (currentScrollPosition < previousScrollPosition) {
   
      console.log('向上滚动');
    }

    previousScrollPosition = currentScrollPosition;
  }, 200); // 延迟时间，可以根据需求调整
});

通过添加一个延迟，我们仅在滚动停止一段时间后才确定方向,各位可以根据自己的需求修改代码！～～