js判断滚动条滚动方向以及滚动位置判断
文章 227 0 0 0
发布时间:2022年02月09日

概述

利用js方法判断当前滚动条滚动的方向,以及滚动位置相关判断,横向滚动纵向滚动。

滚动方向

// 滚动条判断
var num = 0;
window.addEventListener('scroll', function() {
    console.log(document.documentElement.scrollTop)
    var scrollTop = document.documentElement.scrollTop;
    if (num <= scrollTop) {
        console.log('向下')
    } else {
        console.log('向上')
    }
    num = scrollTop
});

滚动状态

window.addEventListener('scroll', function() {
    console.log(document.documentElement.scrollTop)
    var scrollTop = document.documentElement.scrollTop;
    var scrollHeight = document.documentElement.scrollHeight
    if (scrollTop == 0) {
        console.log('开始')
    } else if (scrollHeight == scrollTop){
        console.log('结束')
    } else {
        console.log('运动')
    }
});

横向滚动亦是如此scrollLeft 和scrollWidth

评论专区