[トップに戻る](Back Top)ボタンの効果

    
    
    
    
    



    

    

        

        
    
    
        window.onload = function() {
            var obtn = document.getElementById('btn');
            var timer = null;
            var isTop = true;
            // 
            var clientHeight = document.documentElement.clientHeight || document.body.clientHeight;

            // 
            window.onscroll = function() {
                // 
                var osTop = document.documentElement.scrollTop || document.body.scrollTop;
                if (osTop >= clientHeight) {
                    obtn.style.display = 'block';
                } else {
                    obtn.style.display = 'none';
                }

                if (!isTop) {
                    clearInterval(timer);
                }
                isTop = false;
            };


            btn.onclick = function() {

                // 
                timer = setInterval(function() {
                    // 
                    var osTop = document.documentElement.scrollTop || document.body.scrollTop; // ie Chrome 

                    // 
                    var isSpeed = Math.floor(-osTop / 6);
                    document.documentElement.scrollTop = document.body.scrollTop = osTop + isSpeed;
                    //console.log( osTop + isSpeed);

                    isTop = true;

                    // ， 
                    if (osTop == 0) {
                        clearInterval(timer);
                    }
                }, 30);



            };
        }
    

M移动端：

  $('.backToTop').on('touchend', function () {
            var T = $(window).scrollTop();
            var t = setInterval(function () {
                if (T < 0) {
                    clearInterval(t);
                } else {
                    T -= 50;
                    $(window).scrollTop(T);
                }
            }, 13);
        });