☰

YouTube FullScreen No Controls

Make YouTube FullScreen No Controls

  1. /* ==UserStyle==
  2. @name           YouTube FullScreen No Controls
  3. @namespace      github.com/openstyles/stylus
  4. @version        0.1.4
  5. @description    Make YouTube FullScreen No Controls
  6. @author         CY Fung
  7. @license MIT
  8. ==/UserStyle== */
  9.  
  10.     @-moz-document url-prefix("https://www.youtube.com/watch?v="),
  11.                     url-prefix("https://www.youtube.com/embed/") 
  12.     {
  13.     /* Insert code here... */
  14.     
  15.     
  16.     /* ytp-autohide -> .ytp-fullscreen.html5-video-player */
  17.  
  18.     
  19.     
  20.    /* 
  21. .ytp-fullscreen.html5-video-player {
  22.     cursor: none
  23. }*/
  24.  
  25.  
  26. .ytp-fullscreen.html5-video-player .ytp-player-content:not(.html5-endscreen),.ytp-fullscreen.html5-video-player .ytp-player-content:not(.ytp-upnext),.ytp-hide-info-bar .ytp-player-content {
  27.     top: 0;
  28.     -webkit-transition: bottom .1s cubic-bezier(.4,0,1,1),top .1s cubic-bezier(.4,0,1,1);
  29.     -o-transition: bottom .1s cubic-bezier(.4,0,1,1),top .1s cubic-bezier(.4,0,1,1);
  30.     transition: bottom .1s cubic-bezier(.4,0,1,1),top .1s cubic-bezier(.4,0,1,1)
  31. }
  32.  
  33. .ytp-fullscreen.html5-video-player .ytp-ypc-player-content,.ytp-hide-controls .ytp-player-content {
  34.     bottom: 0
  35. }
  36.  
  37. .ytp-fullscreen.html5-video-player:not(.ytp-ad-overlay-open) .ytp-iv-player-content,.ytp-hide-controls .ytp-iv-player-content {
  38.     bottom: 12px
  39. }
  40.  
  41.  
  42. .ytp-big-mode.ytp-fullscreen.html5-video-player:not(.ytp-ad-overlay-open) .ytp-iv-player-content,.ytp-big-mode.ytp-hide-controls .ytp-iv-player-content {
  43.     bottom: 24px
  44. }
  45.  
  46.  
  47. .ytp-fullscreen.html5-video-player .ytp-playlist-menu-button,.ytp-fullscreen.html5-video-player .ytp-back-button,.ytp-fullscreen.html5-video-player .ytp-title-channel,.ytp-fullscreen.html5-video-player .ytp-title,.ytp-fullscreen.html5-video-player .ytp-chrome-top .ytp-watch-later-button,.ytp-fullscreen.html5-video-player .ytp-chrome-top .ytp-share-button,.ytp-fullscreen.html5-video-player .ytp-chrome-top .ytp-copylink-button,.ytp-fullscreen.html5-video-player:not(.ytp-cards-teaser-shown) .ytp-cards-button,.ytp-fullscreen.html5-video-player .ytp-overflow-button,.ytp-fullscreen.html5-video-player .ytp-chrome-bottom,.ytp-chrome-top[aria-hidden=true],.ytp-chrome-bottom[aria-hidden=true] {
  48.     opacity: 0;
  49.     -webkit-transition: opacity .1s cubic-bezier(.4,0,1,1);
  50.     -o-transition: opacity .1s cubic-bezier(.4,0,1,1);
  51.     transition: opacity .1s cubic-bezier(.4,0,1,1)
  52. }
  53.  
  54. .ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-playlist-menu-button,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-back-button,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-title-channel,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-title,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-chrome-top .ytp-watch-later-button,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-chrome-top .ytp-share-button,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active):not(.ytp-cards-teaser-shown) .ytp-cards-button,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-overflow-button {
  55.     display: none
  56. }
  57.  
  58.  
  59. .ytp-gradient-top[aria-hidden=true],.ytp-gradient-bottom[aria-hidden=true],.ytp-fullscreen.html5-video-player .ytp-gradient-top,.ytp-fullscreen.html5-video-player .ytp-gradient-bottom {
  60.     opacity: 0;
  61.     -webkit-transition: opacity .1s cubic-bezier(.4,0,1,1);
  62.     -o-transition: opacity .1s cubic-bezier(.4,0,1,1);
  63.     transition: opacity .1s cubic-bezier(.4,0,1,1)
  64. }
  65.  
  66. .ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-gradient-top,.ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-gradient-bottom {
  67.     display: none
  68. }
  69.  
  70.  
  71. .ad-showing.ytp-fullscreen.html5-video-player .video-ad-status-bar,.ad-showing.ytp-hide-controls .video-ad-status-bar {
  72.     bottom: 0
  73. }
  74.  
  75. .ytp-fullscreen.html5-video-player.ytp-ad-overlay-closed .ad-overlay {
  76.     opacity: 0;
  77.     -webkit-transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  78.     -o-transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  79.     transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1)
  80. }
  81.  
  82. .ytp-hide-controls .ytp-ad-player-overlay-instream-info,.ytp-hide-controls .ytp-ad-survey-player-overlay-instream-info,.ytp-fullscreen.html5-video-player .ytp-ad-player-overlay-instream-info,.ytp-fullscreen.html5-video-player .ytp-ad-survey-player-overlay-instream-info,.ytp-iv-drawer-open .ytp-ad-player-overlay-instream-info,.ytp-iv-drawer-open .ytp-ad-survey-player-overlay-instream-info,.ytp-embed.ytp-hide-controls .ytp-ad-player-overlay-instream-info,.ytp-embed.ytp-hide-controls .ytp-ad-survey-player-overlay-instream-info,.ytp-embed.ytp-fullscreen.html5-video-player .ytp-ad-player-overlay-instream-info,.ytp-embed.ytp-fullscreen.html5-video-player .ytp-ad-survey-player-overlay-instream-info,.ytp-embed.ytp-iv-drawer-open .ytp-ad-player-overlay-instream-info,.ytp-embed.ytp-iv-drawer-open .ytp-ad-survey-player-overlay-instream-info {
  83.     bottom: 6px;
  84.     -webkit-transition: bottom .1s cubic-bezier(.4,0,1,1);
  85.     -o-transition: bottom .1s cubic-bezier(.4,0,1,1);
  86.     transition: bottom .1s cubic-bezier(.4,0,1,1)
  87. }
  88.  
  89.  
  90. .ytp-fullscreen.html5-video-player.ytp-ad-overlay-closed .ytp-ad-overlay-slot {
  91.     opacity: 0;
  92.     -webkit-transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  93.     -o-transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  94.     transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1)
  95. }
  96.  
  97.  
  98.  
  99. .ytp-fullscreen.html5-video-player .ytp-ad-persistent-progress-bar-container,.ytp-ad-player-overlay-progress-bar .ytp-ad-persistent-progress-bar-container {
  100.     opacity: 1;
  101.     bottom: 0;
  102.     -webkit-transition: bottom .25s cubic-bezier(0,0,.2,1),opacity .25s cubic-bezier(0,0,.2,1);
  103.     -o-transition: bottom .25s cubic-bezier(0,0,.2,1),opacity .25s cubic-bezier(0,0,.2,1);
  104.     transition: bottom .25s cubic-bezier(0,0,.2,1),opacity .25s cubic-bezier(0,0,.2,1)
  105. }
  106.   
  107.  
  108. .ytp-fullscreen.html5-video-player .iv-promo-website-card-cta-redesign.iv-promo-collapsed .iv-promo-img {
  109.     opacity: .8;
  110.     -webkit-transition: transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1),opacity .2s cubic-bezier(.4,0,1,1) .8s;
  111.     transition: transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1),opacity .2s cubic-bezier(.4,0,1,1) .8s
  112. }
  113.  
  114.  
  115. .ytp-fullscreen.html5-video-player.ytp-embed-overlays-autohide .iv-drawer {
  116.     opacity: 0;
  117.     -webkit-transition: opacity .1s cubic-bezier(.4,0,1,1);
  118.     -o-transition: opacity .1s cubic-bezier(.4,0,1,1);
  119.     transition: opacity .1s cubic-bezier(.4,0,1,1)
  120. }
  121.  
  122. .ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active).ytp-embed-overlays-autohide .iv-drawer {
  123.     display: none
  124. }
  125.  
  126.  
  127. .ytp-fullscreen.html5-video-player .iv-drawer-content::-webkit-scrollbar-thumb {
  128.     background-color: transparent
  129. }
  130.  
  131. .ytp-fullscreen.html5-video-player:not(.ytp-cards-teaser-shown) .ytp-cards-teaser,.ytp-iv-drawer-open .ytp-cards-teaser {
  132.     opacity: 0;
  133.     -webkit-transition: opacity .1s cubic-bezier(.4,0,1,1) .33s;
  134.     -o-transition: opacity .1s cubic-bezier(.4,0,1,1) .33s;
  135.     transition: opacity .1s cubic-bezier(.4,0,1,1) .33s
  136. }
  137.  
  138. .ytp-fullscreen.html5-video-player.ytp-embed-overlays-autohide.ytp-contextmenu {
  139.     opacity: 0;
  140.     -webkit-transition: opacity .1s cubic-bezier(.4,0,1,1);
  141.     -o-transition: opacity .1s cubic-bezier(.4,0,1,1);
  142.     transition: opacity .1s cubic-bezier(.4,0,1,1)
  143. }
  144.  
  145. .ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active).ytp-embed-overlays-autohide.ytp-contextmenu {
  146.     display: none
  147. }
  148.  
  149. .ytp-fullscreen.html5-video-player:not(.ytp-mweb-player) .ytp-watermark:not(.ytp-muted-autoplay-watermark) {
  150.     opacity: 0;
  151.     -webkit-transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  152.     -o-transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  153.     transition: bottom .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1)
  154. }
  155.  
  156.  
  157. .ytp-big-mode.ytp-fullscreen.html5-video-player .ytp-info-panel-preview,.ytp-big-mode.ytp-hide-info-bar .ytp-info-panel-preview,.ytp-embed.ytp-fullscreen.html5-video-player .ytp-info-panel-preview,.ytp-embed.ytp-hide-info-bar .ytp-info-panel-preview {
  158.     top: 12px
  159. }
  160.  
  161.  
  162. .ytp-inline-preview-mode.ytp-fullscreen.html5-video-player .ytp-time-display {
  163.     display: none
  164. }
  165.  
  166. .ytp-inline-preview-mode.ytp-fullscreen.html5-video-player .ytp-inline-preview-scrim {
  167.     opacity: 0
  168. }
  169.  
  170. #inline-preview-player.ytp-fullscreen.html5-video-player .caption-window.ytp-caption-window-bottom {
  171.     margin-bottom: 12px
  172. }
  173.  
  174. .ytp-fullscreen.html5-video-player .ytp-offline-slate-bar,.ytp-hide-controls .ytp-offline-slate-bar {
  175.     bottom: 12px;
  176.     -webkit-transition: bottom .1s cubic-bezier(.4,0,1,1);
  177.     -o-transition: bottom .1s cubic-bezier(.4,0,1,1);
  178.     transition: bottom .1s cubic-bezier(.4,0,1,1)
  179. }
  180.  
  181. .ytp-fullscreen.html5-video-player .ytp-big-mode .ytp-offline-slate-bar,.ytp-hide-controls .ytp-big-mode .ytp-offline-slate-bar {
  182.     bottom: 18px
  183. }
  184.  
  185.  
  186.  
  187. .ytp-fullscreen.html5-video-player.ytp-embed-overlays-autohide .ytp-overflow-panel {
  188.     opacity: 0;
  189.     -webkit-transition: opacity .1s cubic-bezier(.4,0,1,1);
  190.     -o-transition: opacity .1s cubic-bezier(.4,0,1,1);
  191.     transition: opacity .1s cubic-bezier(.4,0,1,1)
  192. }
  193.  
  194. .ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active).ytp-embed-overlays-autohide .ytp-overflow-panel {
  195.     display: none
  196. }
  197.  
  198. .ytp-exp-ppp-update.ytp-big-mode.ytp-fullscreen.html5-video-player .ytp-paid-content-overlay,.ytp-exp-ppp-update.ytp-big-mode.ytp-hide-info-bar .ytp-paid-content-overlay,.ytp-exp-ppp-update.ytp-embed.ytp-fullscreen.html5-video-player .ytp-paid-content-overlay,.ytp-exp-ppp-update.ytp-embed.ytp-hide-info-bar .ytp-paid-content-overlay {
  199.     top: 16px
  200. }
  201.  
  202. .ytp-fullscreen.html5-video-player .ytp-paid-content-overlay,.ytp-iv-drawer-open .ytp-paid-content-overlay {
  203.     bottom: 6px;
  204.     -webkit-transition: bottom .1s cubic-bezier(.4,0,1,1);
  205.     -o-transition: bottom .1s cubic-bezier(.4,0,1,1);
  206.     transition: bottom .1s cubic-bezier(.4,0,1,1)
  207. }
  208.  
  209. .ytp-big-mode.ytp-fullscreen.html5-video-player .ytp-paid-content-overlay,.ytp-big-mode.ytp-iv-drawer-open .ytp-paid-content-overlay {
  210.     bottom: 12px
  211. }
  212.   
  213. .ytp-fullscreen.html5-video-player:not(.ytp-fullscreen.html5-video-player-active) .ytp-chrome-top .ytp-shorts-title-channel {
  214.     margin-top: 7px
  215. }
  216.  
  217.  
  218. .ytp-fullscreen.html5-video-player .ytp-webgl-spherical-control,.ytp-hide-info-bar .ytp-webgl-spherical-control {
  219.     top: 12px;
  220.     -webkit-transition: top .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  221.     -o-transition: top .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1);
  222.     transition: top .1s cubic-bezier(.4,0,1,1),opacity .1s cubic-bezier(.4,0,1,1)
  223. }
  224.  
  225.  
  226. .ytp-fullscreen.html5-video-player .caption-window.ytp-caption-window-top,.ytp-hide-info-bar .caption-window.ytp-caption-window-top {
  227.     margin-top: 0;
  228.     -webkit-transition: margin-bottom .1s cubic-bezier(.4,0,1,1),margin-top .1s cubic-bezier(.4,0,1,1);
  229.     -o-transition: margin-bottom .1s cubic-bezier(.4,0,1,1),margin-top .1s cubic-bezier(.4,0,1,1);
  230.     transition: margin-bottom .1s cubic-bezier(.4,0,1,1),margin-top .1s cubic-bezier(.4,0,1,1)
  231. }
  232.  
  233. .ytp-fullscreen.html5-video-player .caption-window.ytp-caption-window-bottom,.ytp-hide-controls .caption-window.ytp-caption-window-bottom,.ytp-muted-autoplay .caption-window.ytp-caption-window-bottom {
  234.     margin-bottom: 0;
  235.     -webkit-transition: margin-bottom .1s cubic-bezier(.4,0,1,1),margin-top .1s cubic-bezier(.4,0,1,1);
  236.     -o-transition: margin-bottom .1s cubic-bezier(.4,0,1,1),margin-top .1s cubic-bezier(.4,0,1,1);
  237.     transition: margin-bottom .1s cubic-bezier(.4,0,1,1),margin-top .1s cubic-bezier(.4,0,1,1)
  238. }
  239.  
  240.  
  241. .ytp-fullscreen.html5-video-player .ytp-unmute,.ytp-hide-info-bar .ytp-unmute {
  242.     top: 0
  243. }
  244.     
  245.     
  246.  
  247.     
  248. }

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

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