Youtube mousewheel volume control

Control youtube video volume by scrolling over the video.

  1. // ==UserScript==
  2. // @name Youtube mousewheel volume control
  3. // @version 1.0.0
  4. // @description Control youtube video volume by scrolling over the video.
  5. // @author Leblayd
  6. // @match https://www.youtube.com/watch?v=*
  7. // @grant none
  8. // @namespace https://gf.qytechs.cn/en/users/292107
  9. // ==/UserScript==
  10.  
  11. var changeAmount = 5;
  12. var hideIndicatorTime = 9000;
  13. var shiftModifier = function(change) { return change * 4; };
  14.  
  15. var player = document.getElementsByClassName("html5-video-container")[0];
  16. player.addEventListener("mouseenter", disableScroll);
  17. player.addEventListener("mouseleave", enableScroll);
  18. player.addEventListener("wheel", volControll);
  19.  
  20. var volText = setUpVolumeIndicator();
  21. player.appendChild(volText);
  22.  
  23. function volControll(e) {
  24. if (e.ctrlKey || e.altKey) return; // cancel if alt or ctrl key is pressed, as we use the default in those cases
  25.  
  26. var video = document.getElementsByClassName("video-stream html5-main-video")[0];
  27. var currVol = video.volume;
  28.  
  29. var direction = e.deltaY < 0;
  30. var actualChange = changeAmount / 100;
  31. if (e.shiftKey) actualChange = shiftModifier(actualChange);
  32.  
  33. if (direction) currVol += actualChange;
  34. else currVol -= actualChange;
  35.  
  36. if (currVol > 1) currVol = 1;
  37. else if (currVol < 0) currVol = 0;
  38.  
  39. video.volume = currVol;
  40.  
  41. document.getElementsByClassName("ytp-volume-panel")[0].setAttribute("aria-valuenow", currVol * 100);
  42. document.getElementsByClassName("ytp-volume-slider-handle")[0].setAttribute("style", "left:" + currVol * 40 + "px;");
  43. document.getElementsByClassName("ytp-svg-fill ytp-svg-volume-animation-speaker")[0].setAttribute("d", getVolumeIconAttribute(currVol));
  44.  
  45. volText.innerHTML = Math.round(currVol * 100,0);
  46. volText.hidden = false;
  47. setTimeout(function() {
  48. volText.hidden = true;
  49. }, hideIndicatorTime);
  50. }
  51.  
  52. function setUpVolumeIndicator() {
  53. var t = document.createElement("h1");
  54. t.style.fontSize = "50px";
  55. t.style.color = "rgba(255,255,155,1)";
  56. t.style.textShadow = "0px 5px 10px rgba(0,0,0,1)";
  57. t.style.margin = "15px 0 0 15px";
  58. t.style.float = "left";
  59. t.style.position = "absolute";
  60. t.style.zIndex = 10000;
  61. t.style.fontWeight = 200;
  62. return t;
  63. }
  64.  
  65. function getVolumeIconAttribute(volume) {
  66. if (volume === 0) return "m 21.48,17.98 c 0,-1.77 -1.02,-3.29 -2.5,-4.03 v 2.21 l 2.45,2.45 c .03,-0.2 .05,-0.41 .05,-0.63 z m 2.5,0 c 0,.94 -0.2,1.82 -0.54,2.64 l 1.51,1.51 c .66,-1.24 1.03,-2.65 1.03,-4.15 0,-4.28 -2.99,-7.86 -7,-8.76 v 2.05 c 2.89,.86 5,3.54 5,6.71 z M 9.25,8.98 l -1.27,1.26 4.72,4.73 H 7.98 v 6 H 11.98 l 5,5 v -6.73 l 4.25,4.25 c -0.67,.52 -1.42,.93 -2.25,1.18 v 2.06 c 1.38,-0.31 2.63,-0.95 3.69,-1.81 l 2.04,2.05 1.27,-1.27 -9,-9 -7.72,-7.72 z m 7.72,.99 -2.09,2.08 2.09,2.09 V 9.98 z";
  67. else if (volume >= 0.5) return "M8,21 L12,21 L17,26 L17,10 L12,15 L8,15 L8,21 Z M19,14 L19,22 C20.48,21.32 21.5,19.77 21.5,18 C21.5,16.26 20.48,14.74 19,14 ZM19,11.29 C21.89,12.15 24,14.83 24,18 C24,21.17 21.89,23.85 19,24.71 L19,26.77 C23.01,25.86 26,22.28 26,18 C26,13.72 23.01,10.14 19,9.23 L19,11.29 Z";
  68. else return "M8,21 L12,21 L17,26 L17,10 L12,15 L8,15 L8,21 Z M19,14 L19,22 C20.48,21.32 21.5,19.77 21.5,18 C21.5,16.26 20.48,14.74 19,14 Z";
  69. }
  70.  
  71. // Disable Scrolling -- https://stackoverflow.com/questions/4770025/how-to-disable-scrolling-temporarily
  72.  
  73. function preventDefault(e) {
  74. e = e || window.event;
  75. e.returnValue = e.altKey || e.ctrlKey; // prevents default, unless alt or ctrl key is pressed
  76. }
  77.  
  78. function disableScroll() {
  79. window.onwheel = preventDefault;
  80. }
  81.  
  82. function enableScroll() {
  83. window.onwheel = null;
  84. }

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址