滚动时间，如何判断 scollTop 到一定高度只执行一次

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

推荐关注

› Meteor

› JSLint - a JavaScript code quality tool

› jsFiddle

› D3.js

› WebStorm

推荐书目

› JavaScript 权威指南第 5 版

› Closure: The Definitive Guide

这是一个创建于 3381 天前的主题，其中的信息可能已经有所发展或是发生改变。

返回顶部按钮渐进渐出的显示出来，可问题是，如果只执行一次！如果判断大于小于，动一下就来一个事件。不想用 jQuery 等第三方库。

function progressiveDisplayBack2Top(){
        var needDisp = document.getElementById('back-to-top');

        function setProgressive(leftNum, interval, upORdown) {
            if (Boolean(upORdown)) {
                var leftNum = leftNum + 0.01;
                if (leftNum > 1) return true;
                needDisp.style.opacity = leftNum;
            } else {
                var leftNum = leftNum - 0.01;
                if (leftNum < 0) return true;
                needDisp.style.opacity = leftNum;
            }
            setTimeout(function() {
                    setProgressive(leftNum, interval, upORdown);
                }, interval);
        }

        if (document.body.scrollTop > 700){
            setProgressive(0.01, 10, true);
        }

        if (document.body.scrollTop < 700){
            setProgressive(1, 10, false);
        }
    }


    addOnloader(function() {
        addOnScrollEvent(progressiveDisplayBack2Top);
    });

3 条回复 • 2015-09-26 21:39:49 +08:00

Septembers

2015-09-26 20:59:06 +08:00

有个概念叫"去抖动"

lixia625

2015-09-26 21:14:23 +08:00 via Android

最简单的难道不是一个 boolean 的事？

emric

2015-09-26 21:39:49 +08:00

函数节流, 函数去抖. 同时对楼主谴责, 连续提 3 个搜索能够得到答案的问题.