返回顶部按钮

给页面添加返回顶部按钮

目前为 2018-04-13 提交的版本。查看 最新版本

// ==UserScript==
// @name         返回顶部按钮
// @namespace    http://tampermonkey.net/
// @version      0.4
// @description  给页面添加返回顶部按钮
// @author       李登科
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    var a = document.createElement('a');
    a.href="javascript:;";
    a.text="TOP";
    a.style.position="fixed";
    a.style.right="5%";
    a.style.bottom="25%";
    a.style.fontSize="20px";
    a.style.textDecoration="none";
    a.style.zIndex=9999;
    a.style.display="none";
    document.querySelector("body").appendChild(a);

    var enterRightBottom = 0;
    var leaveTop = 0;

    function showHide() {
        if (leaveTop && enterRightBottom) {
            a.style.display = "block";
        } else {
            a.style.display = "none";
        }
    }

    window.addEventListener("mousemove", function(e) {
        enterRightBottom = e.clientX > window.innerWidth / 4 * 3 && e.clientY > window.innerHeight / 3 * 2;
        showHide();
    });

    window.addEventListener("scroll", function(){
        leaveTop = (+(document.body.scrollTop || document.documentElement.scrollTop) > 100);
        showHide();
    });

    a.addEventListener("click", function(){
        window.scrollTo(0, 0);
    });

})();