Greasy Fork is available in English.

Back to Top

Scroll Back To Top Button

Ten skrypt nie powinien być instalowany bezpośrednio. Jest to biblioteka dla innych skyptów do włączenia dyrektywą meta // @require https://update.greasyfork.org/scripts/39499/259015/Back%20to%20Top.js

  1. // ==UserScript==
  2. // @name Back to Top
  3. // @namespace https://github.com/maijz128
  4. // @version 0.2
  5. // @description Scroll Back To Top Button
  6. // @author MaiJZ
  7. // @grant none
  8. // ==/UserScript==
  9.  
  10.  
  11. (function () {
  12. 'use strict';
  13.  
  14. const BUTTON_ID = "btnBackToTop";
  15. const TOP_FUNCTION_NAME = "btnBackToTop_TopFunction";
  16.  
  17. addButtonStyle();
  18. addFunction();
  19. addButton();
  20.  
  21. function addButtonStyle() {
  22. var style = '#' + BUTTON_ID + '{';
  23. style += 'display:none; position:fixed; bottom:20px; right:30px; z-index:99; ';
  24. style += 'font-size:15px; border:0; outline:0; background-color:#fff; color:#8590a6; ';
  25. style += 'cursor:pointer; text-align: center; width: 40px; height: 40px; ';
  26. style += 'border-radius:4px; box-shadow:0 1px 3px rgba(26,26,26,.1); ';
  27. style += '}';
  28.  
  29. style += '#' + BUTTON_ID + ':hover { background-color: #d3d3d3; }';
  30.  
  31. addStyle(style);
  32. }
  33.  
  34. function addFunction() {
  35. window.addEventListener("scroll", function () {
  36. var minScrollTop = 50;
  37. if (document.body.scrollTop > minScrollTop || document.documentElement.scrollTop > minScrollTop) {
  38. document.getElementById(BUTTON_ID).style.display = "block";
  39. } else {
  40. document.getElementById(BUTTON_ID).style.display = "none";
  41. }
  42. });
  43.  
  44. var strFun = 'function ' + TOP_FUNCTION_NAME + '()';
  45. // strFun += '{ document.body.scrollTop = 0; document.documentElement.scrollTop = 0;}';
  46. strFun += '{ var scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;';
  47. strFun += 'var increment = scrollHeight / 100;';
  48. strFun += 'var gotoTop= function(){ var currentPosition = document.documentElement.scrollTop || document.body.scrollTop;';
  49. strFun += 'currentPosition -= increment; if(currentPosition>0){window.scrollTo(0,currentPosition)}else{window.scrollTo(0,0);clearInterval(timer);timer = null}}; ';
  50. strFun += 'var timer=setInterval(gotoTop,1); }';
  51.  
  52. var elScript = document.createElement("script");
  53. elScript.innerHTML = strFun;
  54. document.head.appendChild(elScript);
  55. }
  56.  
  57. function addButton() {
  58. var strSVG = '<svg class="" title="Back to Top" fill="#8590a6" viewBox="0 0 24 24" width="24" height="24">';
  59. strSVG += '<path d="M16.036 19.59a1 1 0 0 1-.997.995H9.032a.996.996 0 0 1-.997-.996v-7.005H5.03c-1.1 0-1.36-.633-.578-1.416L11.33 4.29a1.003 1.003 0 0 1 1.412 0l6.878 6.88c.782.78.523 1.415-.58 1.415h-3.004v7.005z"></path></svg>';
  60.  
  61.  
  62. var elButton = document.createElement("button");
  63. elButton.setAttribute('id', BUTTON_ID);
  64. elButton.setAttribute("onclick", TOP_FUNCTION_NAME + '()');
  65. elButton.setAttribute('title', "Back to Top");
  66. elButton.innerHTML = strSVG;
  67.  
  68. document.body.appendChild(elButton);
  69. }
  70.  
  71.  
  72. function addStyle(styleContent) {
  73. var elStyle = document.createElement("style");
  74. elStyle.innerHTML = styleContent;
  75. document.head.appendChild(elStyle);
  76. }
  77. })();