🏠 Home 

Greasy Fork is available in English.

Scroll Up & Down Arrows

Scroll Up & Down arrows, if you leave mouse on arrow it will slowly scroll

  1. // ==UserScript==
  2. // @name Scroll Up & Down Arrows
  3. // @namespace mypage
  4. // @version 1.0
  5. // @description Scroll Up & Down arrows, if you leave mouse on arrow it will slowly scroll
  6. // @include *
  7. // @copyright 2014, drakulaboy
  8. // @require http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
  9. // ==/UserScript==
  10. var scroll_speed = 500;//The smaller, the faster.When you click the button, it works.
  11. var move_speed = 50;//The smaller, the faster. When your mouse moves on the button, it works.
  12. var toumingc_control = 1;//If you don't want to get the opacity(tou'ming in Chinese) changed, set it to 0;
  13. //if(/https?:\/\/twitter\.com/i.test(window.location.href)) document.getElementById("doc").style.position = "static";
  14. function up() {
  15. $(window).scrollTop($(window).scrollTop() - 1);
  16. fq = setTimeout(up, move_speed)
  17. };
  18. function dn() {
  19. $(window).scrollTop($(window).scrollTop() + 1);
  20. fq = setTimeout(dn, move_speed)
  21. };
  22. function create_button() {
  23. if(document.body){
  24. var a = document.createElement('span');
  25. var b = document.createElement('span');
  26. a.id = "shang";
  27. b.id = "xia";
  28. var css_a = 'opacity:1;-moz-transition-duration:0.2s;background:url(data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAUCAYAAACAl21KAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAB+SURBVDhPY1i1atV/amAGahgCMoNhaIGlS5cKAp19BoRBbLJcj2QILDJINwzoAmMgfoclIkBixkS5DI8hMJcRNgxoSBoOl6CnNZBhaVhdBjWE1MSJahjQkA4KEmYH2GUrV66cSYEhYB+AzKBtFiHkQqKiH6Ro1CDCQTWgYQQAs81DU0G/83sAAAAASUVORK5CYII=) no-repeat scroll 50% 50% rgba(0, 0, 0, 0.7);border-radius:5px 0 0 5px;cursor:pointer;height:36px;margin-top:-24px;width:36px;position:fixed;right:10px;bottom:53%;z-index:1';
  29. var css_b ='opacity:1;-moz-transition-duration:0.2s;background:url(data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAUCAYAAACAl21KAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACPSURBVDhPY2DAAlatWvUfH8amB6vYqEGEg2pgw4iQ7cTKM6xcuXImsYpxqQOZAQ4woIIOCgzrQAl1oEFpZBiWhitFgwx7R4SBIDXYDYGZDFRgTMAwkCHGhBMRJMxwGUa8ITCbli5dKgg08AySN8+AxIhyCboiJMPIN4Qsm6miiYioxltawvSDYogohYTUAQC80UNTOht/YwAAAABJRU5ErkJggg==) no-repeat scroll 50% 50% rgba(0, 0, 0, 0.7);border-radius:5px 0 0 5px;cursor:pointer;height:36px;margin-top:-24px;width:36px;position:fixed;right:10px;top:53%;z-index:1';
  30. a.style.cssText = css_a;
  31. b.style.cssText = css_b;
  32. a.addEventListener('mouseover',up, false);
  33. b.addEventListener('mouseover',dn, false);
  34. a.addEventListener('mouseout',function(){clearTimeout(fq);},false);
  35. b.addEventListener('mouseout',function(){clearTimeout(fq);},false);
  36. a.addEventListener('click', function(){ $("html,body").animate({scrollTop:0},scroll_speed); }, false);
  37. b.addEventListener('click', function(){ $("html,body").animate({scrollTop:$(document).height()},scroll_speed); }, false);
  38. if(toumingc_control){
  39. $(window).scroll(function(){
  40. if($(window).scrollTop()){
  41. a.style.display = "";
  42. }
  43. else{
  44. a.style.display ="none";
  45. }
  46. a.style.opacity=($(window).scrollTop())/($(document).height()-$(window).height());
  47. b.style.opacity=1 - ( a.style.opacity );
  48. });
  49. }
  50. document.body.appendChild(a);
  51. document.body.appendChild(b);
  52. }
  53. };
  54. if(window != window.top) return 0;
  55. if($(document).height()-$(window).height()) create_button();