js回到顶部

document.querySelector(".backTop").addEventListener("click", () => {
            let el = document.body || document.documentElement
            el.scrollIntoView({ behavior: "smooth" })
        });

 方式2:

window.onload = () => {
    let backTop = document.querySelector('.backTop')
    let main = document.querySelector('#main')

    backTop.style.display = 'none';

    let clientHeight = main.clientHeight;
    let time = null;
    let isTop = true,
        cancelScroll = false;

    main.onscroll = () => {

        let osTop = main.scrollTop
        if (osTop >= clientHeight) {
            backTop.style.display = 'block';
        } else {
            backTop.style.display = 'none';
        }
        if (!isTop) {
            clearInterval(time);
        }
        isTop = false;
    }

    backTop.onclick = () => {
        if (!cancelScroll) {
            time = setInterval(() => {
                let osTop = main.scrollTop
                let ispeed = Math.floor(-osTop / 10);
                main.scrollTop = osTop + ispeed;
                isTop = true;
                if (osTop == 0) {
                    clearInterval(time);
                }
            }, 10);
        } else {
            clearInterval(time);
            cancelScroll = true;
        }
    }
}

 

posted @ 2021-04-20 09:52  699byte  阅读(45)  评论(0)    收藏  举报