猫史档案馆

大家知道代码岛更新了

有一个微不足到的东西

那就是吸顶灯

但代码岛的吸顶灯并不是很好

应为...一下子就上去了没有那个效果

我建议用下面这段代码修复一下

<script type="text/javascript">
    window.onload = function(){
        var totop = document.getElementById("btn");
        // 页面加载后隐藏按钮
        totop.style.display = "none";


        // 吸顶灯功能实现
        var nav = document.getElementById("nav");
        var navTop = nav.offsetTop;
        // console.log(navTop);


        
        var timer = null;
        // 添加点击事件
        totop.onclick = function(){
            timer = setInterval(function(){
                var backtop = document.documentElement.scrollTop || document.body.scrollTop;
                // 越滚越慢
                var speedTop = backtop/5;
                document.documentElement.scrollTop = backtop-speedTop;
                if(backtop == 0){
                    clearInterval(timer);
                }
            },30);
        }

        var pageHeight = 700;
        window.onscroll = function(){
            // console.log("111");
            var backtop = document.documentElement.scrollTop || document.body.scrollTop;
            if(backtop >= pageHeight){
                totop.style.display = "block";
            }else{
                totop.style.display = "none";
            }


            // 吸顶灯功能实现
            if(backtop>=navTop){
                nav.style.position = "fixed";
                nav.style.top = 0;
                nav.style.left = 0;
                nav.style.zIndex = 100;
            }else{
                nav.style.position = "";
            }
        }

        
    }
</script>

用上面的那段代码

会与走愈慢

最后达到顶部

建议@吉吉喵使用