4

So I'm wondering if there is a way for me to disable the YouTube controls, seekbar, and title (watch later) overlay buttons.

I use the YouTube keyboard shortcuts all the time and when I see the top and bottom overlay slide in, it irritates the crap out of me as it hides useful info behind the semi transparent bars.

I'm using Firefox with Stylish installed but can't seem to find a way to do this.

Brock Adams
  • 90,639
  • 22
  • 233
  • 295
sdrtyrty rtyuty
  • 147
  • 1
  • 1
  • 9

5 Answers5

4

If you set YouTube to always use the HTML5 player (a good idea anyway), then you can hide the controls using Stylish.
This does the trick:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("www.youtube.com") {
    .ytp-chrome-bottom, .ytp-chrome-top {
        display: none !important;
    }
}

But be warned:

  1. It's probably not possible to hide the Flash player controls. (Don't use Flash anyway.)
  2. Using Stylish like this hides the controls at all times -- which I find just as annoying as the controls flashing up at unwanted times.
Brock Adams
  • 90,639
  • 22
  • 233
  • 295
  • 1
    Thanks, this does exactly what I wanted. I set the top to disable, and the bottom part as full transparent until I hover over it then full opacity. – sdrtyrty rtyuty Mar 18 '16 at 01:15
  • I believe stylish is no longer recommended due to privacy concerns. Maybe a userscript would be safer not sure. – userrandrand Aug 21 '23 at 16:03
2

I implement this in chrome, and this method should work in firefox.

Firstly, install an ad blocker extenstion like AdBlocker.

Secondly, open extenstion options interface and add following code snippet to your own filter:

youtube.com###movie_player > div.ytp-gradient-top
youtube.com###movie_player > div.ytp-chrome-top
youtube.com###movie_player > div.ytp-gradient-bottom

Then it wiil work.

An image descrip this: block title when full screen

How to find that filter, it also is easy, open your target website and click F12 key, do this first : find filter

Then construct a formula defined by AdBlocker:

(Website's Host)##(The selector)

and here is:

youtube.com###movie_player > div.ytp-chrome-bottom

It should be noted that you need set the video full screen to find the selector when you want to block the title in full screen mode.

(There may be a grammatical error, but I don’t think it will affect your understanding.)

XQ DD
  • 59
  • 4
2

It worked after adding these in Ublock Origin Filters:

youtube.com###movie_player > div.ytp-gradient-top
youtube.com###movie_player > div.ytp-chrome-top
youtube.com###movie_player > div.ytp-gradient-bottom
Ardent Coder
  • 3,777
  • 9
  • 27
  • 53
shahidev
  • 91
  • 6
0

The easy way to do it is:

  • Go to 'share' then click 'embed';
  • You get a video preview and just uncheck the relevant options below.
Greenonline
  • 1,330
  • 8
  • 23
  • 31
illmatched
  • 1
0

Need Stylus.

In fullscreen, controls will be hidden unless mouse over the botton area.

.html5-video-player.ytp-fullscreen > .ytp-chrome-top,
.html5-video-player.ytp-fullscreen > .ytp-gradient-top,
.html5-video-player.ytp-fullscreen > .ytp-gradient-bottom {
    display: none !important;
}
.html5-video-player.ytp-fullscreen > .ytp-caption-window-container > .caption-window.ytp-caption-window-bottom {
    margin-bottom: 0;
}
.html5-video-player.ytp-fullscreen > .ytp-chrome-bottom:hover {
    opacity: 1 !important;
}
.html5-video-player.ytp-fullscreen > .ytp-chrome-bottom:not(:hover) {
    opacity: 0 !important;
}
user2360478
  • 11
  • 5