☰

Youtube Scrollable Right Side Description

Youtube description is moved on the right, expanded and scrollable

当前为 2022-10-25 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name            Youtube Scrollable Right Side Description
  3. // @description     Youtube description is moved on the right, expanded and scrollable
  4. // @version         2.1.2
  5. // @author          SH3LL
  6. // @license         MIT
  7. // @match           *://*.youtube.com/*
  8. // @include         *://*.youtube.com/watch*
  9. // @grant           none
  10. // @run-at          document-end
  11. // @noframes
  12. // @namespace https://greasyfork.org/users/762057
  13. // ==/UserScript==
  14.  
  15. (function(){
  16.     'use strict';
  17.  
  18.      window.addEventListener('yt-page-data-updated', function () {
  19.           let player = document.querySelector("#player");
  20.           let player_height = parseFloat(document.querySelector(".ytp-iv-video-content").style.getPropertyValue("height"));
  21.           let my_height = player_height-100;
  22.  
  23.           // move elements
  24.           document.querySelector('#related').prepend(document.getElementById('bottom-row'));  // move description on the right
  25.           document.querySelector('#related').prepend(document.getElementById('owner'));       // move channel name on the right
  26.           document.querySelector('#below').prepend(document.getElementById('info-container'));// move views and date below the video
  27.           document.querySelector('#info-container').setAttribute("style", "color:white");     // color views white
  28.  
  29.           // remove padding from channel name
  30.           let channel_name = document.getElementById('owner');
  31.           channel_name.setAttribute("style", "margin:0");
  32.  
  33.           // make the description scrollable
  34.           let description = document.getElementById('description-inline-expander');
  35.           description.setAttribute("style", "margin:0"); // remove padding of description
  36.           description.setAttribute("style", "margin-left: 0; overflow: auto; max-width: 100%; font-size: 1.3rem;line-height: normal; max-height:"+my_height+"px;overflow: auto; width: auto; padding-top: 0; padding-bottom: 0; margin-right: 0 !important; background-color: var(--yt-playlist-background-item); padding: 8px; border-bottom-width: 0px;--yt-endpoint-text-decoration: underline;");
  37.  
  38.           // expand description
  39.           description.setAttribute("is-expanded");
  40.           document.getElementById('expand').remove();//hide expand label
  41.           document.getElementById('collapse').remove();//hide collapse label
  42.           document.getElementById('snippet').remove();//hide dots at the end of the comments
  43.  
  44.         }, 1000);
  45.  
  46.     })()