平滑的滚动到顶部/底部

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

Version au 24/03/2015. Voir la dernière version.

Vous devrez installer une extension telle que Tampermonkey, Greasemonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Userscripts pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey pour installer ce script.

Vous devrez installer une extension de gestionnaire de script utilisateur pour installer ce script.

(J'ai déjà un gestionnaire de scripts utilisateur, laissez-moi l'installer !)

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

(J'ai déjà un gestionnaire de style utilisateur, laissez-moi l'installer!)

// ==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";});}));