github.com 写一个方法判断页面滚动方向
要判断页面的滚动方向，可以通过监听 `scroll` 事件来实现。以下是一个简单的 JavaScript 方法，能够检测用户滚动页面的方向（向上或向下）。
### 实现思路
1. 记录上一次的滚动位置。
2. 在 `scroll` 事件中获取当前滚动位置。
3. 比较当前滚动位置与上一次滚动位置的大小关系，从而判断滚动方向。
4. 更新上一次滚动位置。
### 代码示例
```javascript
let lastScrollTop = 0; // 记录上一次的滚动位置
// 添加滚动事件监听
window.addEventListener('scroll', function() {
// 获取当前滚动位置
const currentScrollTop = window.pageYOffset || document.documentElement.scrollTop;
// 判断滚动方向
if (currentScrollTop > lastScrollTop) {
console.log('向下滚动'); // 用户向下滚动
} else {
console.log('向上滚动'); // 用户向上滚动
}
// 更新上一次的滚动位置
lastScrollTop = currentScrollTop <= 0 ? 0 : currentScrollTop; // 确保不为负值
});
```
### 注意事项
- **性能考虑**：在实际应用中，`scroll` 事件会频繁触发，因此建议使用防抖或节流技术来优化性能，避免过多的事件处理。
- **跨浏览器兼容性**：使用 `window.pageYOffset` 和 `document.documentElement.scrollTop` 来确保兼容性。
- **页面加载时**：在页面加载时可以初始化 `lastScrollTop`，以避免首次滚动时的错误判断。
### 总结
上述方法可以有效地判断用户在网页中的滚动方向。通过监听 `scroll` 事件并比较滚动位置，可以灵活地实现相应的功能，比如动态加载内容、导航栏的显示与隐藏等。
