zoukankan      html  css  js  c++  java
  • 时隔一年,window.scroll

    function scrollToTop() {
            return function(btn, input) {
                var flag = false;
                var timer;
    
                function autoScroll(input) {
                    var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
                    if (scrollTop !== 0) {
                        timer = setInterval(function() {
                            var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
                            if (scrollTop === 0) {
                                clearInterval(timer);
                            } else {
    
                                scrollTop -= (document.body.scrollTop) / 8;
                                document.documentElement.scrollTop = document.body.scrollTop = (scrollTop < 5 ? scrollTop = 0 : scrollTop);
                                input.value = scrollTop;
                                flag = true;
                            }
                        }, 50);
                    }
                }
                window.onscroll = function() {
                    if (!flag) {
                        clearInterval(timer);
                    }
                    flag = false;
                };
    
                btn.onclick = function() {
                    autoScroll(input);
                };
            };
        }

    看了看14年底写的关于页面滚动的代码,居然还是有让我值得思考才能想明白的问题.顿时觉得进步有限.今天我把曾经的代码做了一个封装.避免了全局变量的出现.代码如上.

    使用方法:

     window.onload = function() {
            var btn = document.getElementsByTagName('button')[0];
            var oInput = document.getElementsByTagName('input')[0];
            var s = scrollToTop();
            s(btn, oInput);
     };
  • 相关阅读:
    第01组 团队Git现场编程实战
    2019 SDN上机第1次作业
    第二次结对编程作业
    团队项目-需求分析报告
    团队项目-选题报告
    2019 SDN阅读作业
    2019 SDN上机第3次作业
    2019 SDN上机第2次作业
    2019 SDN上机第1次作业
    OpenDayLight安装Features
  • 原文地址:https://www.cnblogs.com/zhangfengyang/p/5065808.html
Copyright © 2011-2022 走看看