平滑的滚动到顶部/底部

为网页增加滚到顶部和底部按钮

Versão de: 24/03/2015. Veja: a última versão.

Você precisará instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Você precisará instalar uma extensão como o Tampermonkey para instalar este script.

Você precisará instalar um gerenciador de scripts de usuário para instalar este script.

(Eu já tenho um gerenciador de scripts de usuário, me deixe instalá-lo!)

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

(Eu já possuo um gerenciador de estilos de usuário, me deixar fazer a instalação!)

// ==UserScript==
// @name	平滑的滚动到顶部/底部
// @author	burningall
// @description	为网页增加滚到顶部和底部按钮
// @version     2015.3.24-1.0
// @include			http://*
// @include			https://*
// @include			ftp://*
// @supportURL		http://www.burningall.com
// @contributionURL	[email protected]|alipay.com
// @namespace https://greatest.deepsurf.us/zh-CN/users/3400-axetroy
// ==/UserScript==

function addEvent(obj,event,fn){return obj.addEventListener?obj.addEventListener(event,fn,false):obj.attachEventListener("on"+event,fn);}(addEvent(window,"load",function(){function $(id){return document.getElementById(id);}function getStyle(obj,attr){return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];}function getScrollTop(){return document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop;}function getClientHeight(){return document.documentElement?document.documentElement.clientHeight:document.body.clientHeight;}function getScrollHeight(){return document.body?bodyScrollHeight=document.body.scrollHeight:document.documentElement.scrollHeight;}function createElement(tagName,idName,styleList,appendPosition,endFn){var newElement=document.createElement(tagName);newElement.id=idName;newElement.style.cssText=styleList;appendPosition&&appendPosition.appendChild(newElement);endFn&&endFn();}function doMove(obj,attr,dir,target,endFn){dir=parseInt(getStyle(obj,attr))<target?dir:-dir;clearInterval(obj.timer);obj.timer=setInterval(function(){var speed=parseInt(getStyle(obj,attr))+dir;if(speed>target&&dir>0||speed<target&&dir<0){speed=target;}obj.style[attr]=speed+"px";if(speed==target){clearInterval(obj.timer);endFn&&endFn();}},30);}createElement("div","scrollMars-troy","width:100px;height:120px;position:fixed;right:20px;top:200px",document.documentElement);$("scrollMars-troy").innerHTML="<div id='goTop-troy' class='Top-and-Btn'></div><div id='goBtn-troy' class='Top-and-Btn'></div>";var scrollStyle="width:40px;height:40px;text-align:center;padding:5px;margin:5px auto;background:#303030;color:#fff;display:block;opacity:0.8;fitter:alpha(opacity:80);cursor:pointer;border-radius:50%;box-shadow:2px 2px 40px 2px #303030;font-size:16px";$("goTop-troy").style.cssText=scrollStyle;$("goBtn-troy").style.cssText=scrollStyle;$("goTop-troy").innerHTML="顶<br/>部";$("goBtn-troy").innerHTML="底<br/>部";addEvent($("goTop-troy"),"click",function(){clearInterval($("goTop-troy").timer);$("goTop-troy").timer=setInterval(function(){var speed=(getScrollTop()/5)+10;position=getScrollTop()-speed;if(position<=0){document.body.scrollTop=document.documentElement.scrollTop=0;clearInterval($("goTop-troy").timer);$("goTop-troy").timer=null;}document.body.scrollTop=document.documentElement.scrollTop=position;},30);});addEvent($("goBtn-troy"),"click",function(){clearInterval($("goTop-troy").timer);$("goTop-troy").timer=setInterval(function(){var speed=(getScrollTop()/5)+10;position=getScrollTop()+speed;if(position+getClientHeight()>=getScrollHeight()){document.body.scrollTop=document.documentElement.scrollTop=getScrollHeight();clearInterval($("goTop-troy").timer);$("goTop-troy").timer=null;}document.body.scrollTop=document.documentElement.scrollTop=position;},30);});addEvent($("scrollMars-troy"),"mouseover",function(){doMove($("scrollMars-troy"),"right",10,20,function(){doMove($("scrollMars-troy"),"width",20,100);});});addEvent($("scrollMars-troy"),"mouseout",function(){doMove($("scrollMars-troy"),"right",10,-80,function(){doMove($("scrollMars-troy"),"width",20,160);});});addEvent($("goTop-troy"),"mouseover",function(){$("goTop-troy").style.background="#FF0004";});addEvent($("goTop-troy"),"mouseout",function(){$("goTop-troy").style.background="#303030";});addEvent($("goBtn-troy"),"mouseover",function(){$("goBtn-troy").style.background="#FF0004";});addEvent($("goBtn-troy"),"mouseout",function(){$("goBtn-troy").style.background="#303030";});}));