美文网首页
回到顶部按钮,滑动显示,停滚定时淡出

回到顶部按钮,滑动显示,停滚定时淡出

作者: 南台观芸秀 | 来源:发表于2020-01-06 18:35 被阅读0次
            var timer = null,
                out = null,
                t1 = 0,
                t2 = 0;

            document.onscroll= function(){
                if (getscroll() > 200) {
                    $(".scroll_top").fadeIn();
                    clearTimeout(out);
                    t1 = getscroll();
                    // console.log("t1=" + t1);
                    out= setTimeout(stopscroll,4000);
                } else {
                    $(".scroll_top").fadeOut();
                }
            };
            
            function stopscroll() { 
                t2 = getscroll();
                console.log("t2=" + t2);
                console.log("t1=" + t1);
                if (t2 === t1) {
                    // console.log('按钮消失了')
                    $(".scroll_top").fadeOut();
                }
            }

            function getscroll() {
                return document.body.scrollTop || document.documentElement.scrollTop;
            }
            //点击跳至网页顶部
            $(".scroll_top").click(function() {
                $(document).scrollTop(0);
            })
都是血汗,请给我个赞.png

相关文章

网友评论

      本文标题:回到顶部按钮,滑动显示,停滚定时淡出

      本文链接:https://www.haomeiwen.com/subject/ebnkactx.html