Scroll to Bottom or Top

为网页增加滚到页首和页尾的按钮

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name	Scroll to Bottom or Top
// @author	midpoint
// @description	为网页增加滚到页首和页尾的按钮
// @version     2014.9.21
// @include     *
// @exclude     http://*facebook.com*
// @exclude     https://*facebook.com*
// @namespace https://greatest.deepsurf.us/users/5506
// ==/UserScript==

//top button
var a = document.createElement('span');
var c = 'opacity:0.5;-moz-transition-duration:0.2s;-webkit-transition-duration:0.2s;background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAUBAMAAAByuXB5AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAbUExURf///6qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqpshoL4AAAAIdFJOUwARM2aImczuGAB4owAAAAlwSFlzAAAOwwAADsMBx2+oZAAAAEZJREFUGNNj6IABBgQLB2BME4CyxDoSIQymio52BTBLHaixCMRgrgCy2g2ALAuwac0MDCxQgx0YIqCsVhTbOIBUA9gUslkA7dcxR/3Xli8AAAAASUVORK5CYII=") no-repeat scroll 50% 50% rgba(0, 152, 255, 1);border-radius:0px 0px 0px 0px;cursor:pointer;position:fixed;bottom:50%;width:36px;height:36px;right:10px;z-index:9999';
a.style.cssText = c; 
a.addEventListener('mouseover', function(){ a.style.opacity = 1;}, false);
a.addEventListener('mouseout', function(){ a.style.opacity = 0.5; }, false);
a.addEventListener('click', function(){ window.scrollTo(0,0); }, false);
//a.addEventListener('click', function(){ $("html,body").animate({scrollTop:"0px"},200); }, false );
document.body.appendChild(a);

//bottom button
var newHeight = document.body.scrollHeight;
var b = document.createElement('span');
var d = 'opacity:0.5;-moz-transition-duration:0.2s;-webkit-transition-duration:0.2s;background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAUBAMAAAByuXB5AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAbUExURf///6qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqpshoL4AAAAIdFJOUwARM2aImczuGAB4owAAAAlwSFlzAAAOwwAADsMBx2+oZAAAAE1JREFUGNNjYGDg6OjoaGAAAfJZHTDAEAFltDKwQFkODAwWYEYzUCFzBZDRbgDSqw5kFYFNYaroaFcAsxjEOhIhDAbGNAEGHABhG5wFAH6qMUfw6SaOAAAAAElFTkSuQmCC") no-repeat scroll 50% 50% rgba(0, 152, 255, 1);border-radius:0px 0px 0px 0px;cursor:pointer;position:fixed;bottom:45%;width:36px;height:36px;right:10px;z-index:9999';//top:52%;
b.style.cssText = d;   
b.addEventListener('mouseover', function(){ b.style.opacity = 1; }, false);
b.addEventListener('mouseout', function(){ b.style.opacity = 0.5; }, false);
b.addEventListener('click', function(){ window.scrollTo(0,newHeight); }, false);
document.body.appendChild(b);

//http://file.ithome.com/js/common.js
var lastScrollY=0;
(function gotop(){
	var diffY;
        diffY = document.documentElement.scrollTop+document.body.scrollTop;
	percent=.1*(diffY-lastScrollY);
	if(percent>0)percent=Math.ceil(percent);
	else percent=Math.floor(percent);
	lastScrollY=lastScrollY+percent;
	if(lastScrollY>100){
	a.style.display="block";b.style.display="block";
	} else {
        b.style.display="block";a.style.display="none";
	}
        setTimeout(gotop,1);
})();