☰

YouTube.com more playback speeds (Mobile / Desktop)

Adds 2.25x 2.5x 2.75x 3x speed buttons below the video. Works on mobile, tablet (m.youtube.com) and on desktop.

当前为 2025-01-01 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         YouTube.com more playback speeds (Mobile / Desktop)
  3. // @namespace    m-youtube-com-more-playback-speeds
  4. // @version      1.12
  5. // @description  Adds 2.25x 2.5x 2.75x 3x speed buttons below the video. Works on mobile, tablet (m.youtube.com) and on desktop.
  6. // @author       hlorand.hu
  7. // @match        https://m.youtube.com/*
  8. // @match        https://youtube.com/*
  9. // @match        https://*.youtube.com/*
  10. // @icon         https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net
  11. // @grant        none
  12. // @license      https://creativecommons.org/licenses/by-nc-sa/4.0/
  13. // ==/UserScript==
  14.  
  15. // Screenshot: https://ibb.co/chtmD9F
  16.  
  17. (function() {
  18.     //'use strict';
  19.  
  20.     function setspeed(speed){
  21.  
  22.         // highlight
  23.         document.querySelectorAll(".speedbutton").forEach((btn)=>{
  24.             if( btn.textContent == speed){
  25.                 btn.style.backgroundColor = "darkorange";
  26.             } else {
  27.                 btn.style.backgroundColor = "blue";
  28.             }
  29.         });
  30.  
  31.         let video = document.querySelector("video");
  32.  
  33.         if(video && video.readyState >= 2) {
  34.  
  35.             localStorage.setItem("yt_playbackspeed", speed);
  36.  
  37.             video.playbackRate = speed;
  38.             video.mozPreservesPitch = video.webkitPreservesPitch = video.preservePitch = true;
  39.         }
  40.     }
  41.  
  42.     function addbuttons(){
  43.         document.getElementById("speedbuttons").innerText = "";
  44.  
  45.         const speeds = ["3.5","3.25","3.0","2.75","2.5","2.25","2.0","1.75","1.5","1.25","1.0"];
  46.  
  47.         speeds.forEach((speed)=>{
  48.             let button = document.createElement('button');
  49.             button.textContent = speed;
  50.             button.className = "speedbutton";
  51.  
  52.             button.style.margin = "4px";
  53.             button.style.padding = "4px";
  54.  
  55.             button.style.backgroundColor = "blue";
  56.             button.style.position = "relative";
  57.  
  58.             button.onclick = function() {
  59.                 setspeed(this.textContent);
  60.             };
  61.  
  62.             let target = document.getElementById("speedbuttons");
  63.             target.insertBefore(button, target.firstChild);
  64.  
  65.         }); // end speeds foreach
  66.  
  67.     } // end addbuttons
  68.  
  69.     // Periodically check if the buttons are visible
  70.     // (sometimes YouTube redraws its interface).
  71.     setInterval(()=>{
  72.         // Creating a div that will contain buttons.
  73.         if( document.getElementById("speedbuttons") == undefined ){
  74.             
  75.             // placement of buttons on desktop
  76.             let parent = document.getElementById('above-the-fold');
  77.  
  78.             // placement of buttons on tablet
  79.             if( !parent ){
  80.                 parent = document.querySelector('.watch-below-the-player');
  81.             }
  82.  
  83.             // placement of buttons on mobile
  84.             if( !parent ){
  85.                 parent = document.querySelector('.related-chips-slot-wrapper');
  86.             }
  87.  
  88.             let wrapper = document.createElement('div');
  89.             wrapper.setAttribute("id","speedbuttons");
  90.             parent.insertBefore(wrapper, parent.firstChild);
  91.             addbuttons();
  92.  
  93.         }
  94.  
  95.         // Sometimes the buttons are not added, so I check and add them if necessary.
  96.         if( document.getElementById("speedbuttons").textContent.trim() === '' ){
  97.             addbuttons();
  98.         }
  99.  
  100.         setspeed( localStorage.getItem("yt_playbackspeed") ?? 1 );
  101.  
  102.     }, 1000);
  103.  
  104. })();