☰

Scroll Up & Down Arrows With Hotkeys

Scroll Up & Down arrows, if you leave mouse on arrow it will slowly scroll, you can adjust speed and control scroll with hotkeys.

  1. // ==UserScript==
  2. // @name       Scroll Up & Down Arrows With Hotkeys
  3. // @description  Scroll Up & Down arrows, if you leave mouse on arrow it will slowly scroll, you can adjust speed and control scroll with hotkeys.
  4. // @author     guizi22
  5. // @version    1.0
  6. // @match      http://*/*
  7. // @require     http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
  8. // @namespace https://greasyfork.org/users/4243
  9. // ==/UserScript==
  10.  
  11.  
  12. var scroll_speed = 500;//The smaller, the faster.When you click the button, it works.
  13. var move_speed = 100;//The smaller, the faster. When your mouse moves on the button, it works.
  14. var toumingc_control = 1;//If you don't want to get the opacity(tou'ming in Chinese) changed, set it to 0;
  15.  
  16. //if(/https?:\/\/twitter\.com/i.test(window.location.href)) document.getElementById("doc").style.position = "static";
  17.  
  18. var DOM_VK_SLOWER = 189;
  19. var DOM_VK_FASTER = 187;
  20. var DOM_VK_ESCAPE = 27;
  21.  
  22. window.addEventListener('keydown', adjust_speed, true);
  23.  
  24. //调节滚屏速度
  25. function adjust_speed(e)
  26. {
  27.     if(e.keyCode == DOM_VK_FASTER) // 按“=”滚屏加速
  28.     {
  29.         move_speed *= 0.80;
  30.     }
  31.     else if(e.keyCode == DOM_VK_SLOWER) // 按“-”滚屏减速
  32.     {
  33.         move_speed *= 1.20;
  34.     }
  35.     else if(e.keyCode == DOM_VK_ESCAPE) // 按“Esc”恢复初始滚屏速度
  36.     {
  37.         move_speed = 100;
  38.     }
  39. }
  40.  
  41. //向上滚屏
  42. function up() {
  43.  
  44.     $(window).scrollTop($(window).scrollTop() - 1);
  45.     fq = setTimeout(up, move_speed)
  46. };
  47.  
  48. //向下滚屏
  49. function dn() {
  50.  
  51.     $(window).scrollTop($(window).scrollTop() + 1);
  52.     fq = setTimeout(dn, move_speed)
  53. };
  54.  
  55. //创建滚屏箭头
  56. function create_button() {
  57. 	if(document.body){
  58. 		var a = document.createElement('span');
  59. 		var b = document.createElement('span');
  60. 		a.id = "shang";
  61. 		b.id = "xia";
  62. 		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';
  63. 		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';
  64.  
  65. 		a.style.cssText = css_a;
  66. 		b.style.cssText = css_b;
  67. 		a.addEventListener('mouseover',up, false);
  68. 		b.addEventListener('mouseover',dn, false);
  69. 		a.addEventListener('mouseout',function(){clearTimeout(fq);},false);
  70. 		b.addEventListener('mouseout',function(){clearTimeout(fq);},false);
  71. 		a.addEventListener('click', function(){ $("html,body").animate({scrollTop:0},scroll_speed); }, false);
  72. 		b.addEventListener('click', function(){ $("html,body").animate({scrollTop:$(document).height()},scroll_speed); }, false);
  73.  
  74. 		if(toumingc_control){
  75. 		$(window).scroll(function(){
  76. 			if($(window).scrollTop()){
  77. 				a.style.display = "";
  78. 			}
  79. 			else{
  80. 				a.style.display ="none";
  81. 			}
  82. 			a.style.opacity=($(window).scrollTop())/($(document).height()-$(window).height());
  83. 			b.style.opacity=1 - ( a.style.opacity );
  84. 		});
  85. 		}
  86. 		document.body.appendChild(a);
  87. 		document.body.appendChild(b);
  88. 	}
  89. };
  90. if(window != window.top) return 0;
  91. if($(document).height()-$(window).height())	create_button();
  92.  
  93. //翻页快捷键
  94. (function () {
  95.     var newHeight = document.body.scrollHeight + 9999999999;
  96.     var scroll = {
  97.         's' : function() { scrollBy(0,  40) },
  98. 		'S'	: function() { scrollBy(0,  40) }, 						// 往下翻一点点
  99. 		'd' : function() { scrollBy(0,  window.innerHeight / 1.2) },
  100. 		'D' : function() { scrollBy(0,  window.innerHeight / 1.2) },  // 往下翻一页
  101. 		
  102. 		'w' : function() { scrollBy(0, -40) },
  103. 		'W' : function() { scrollBy(0, -40) }, 						// 往上翻一点点
  104. 		'a' : function() { scrollBy(0, -window.innerHeight / 1.2) },
  105. 		'A' : function() { scrollBy(0, -window.innerHeight / 1.2) },  // 往上翻一页
  106. 		
  107. 		'q' : function() { scrollTo(0, 0) },
  108. 		'Q' : function() { scrollTo(0, 0) },						// 回页首
  109. 		
  110. 		'e' : function() { scrollTo(0,document.body.scrollHeight) },
  111. 		'E' : function() { scrollTo(0,document.body.scrollHeight) },// 回页尾
  112.     };
  113.     var formElement = { 'input':true, 'button':true, 'select':true, 'textarea':true };
  114.     window.addEventListener('keypress',
  115.         function(e) {
  116.             if (e.metaKey || e.ctrlKey || e.altKey ||
  117.                 formElement[e.target.tagName.toLowerCase()] || e.target.isContentEditable || document.designMode ==="on") {
  118.                 return; }
  119.             var key = (e.shiftKey? 'S-' : '') + String.fromCharCode(e.charCode);
  120.             if (scroll[key]) {
  121.                 scroll[key]();
  122.                 e.preventDefault();
  123.                 e.stopPropagation();
  124.             }
  125.         }, false);
  126. })();