Is there a way to hide YouTube controls completely while in full screen?

Question

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.

Solution 1

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.

Solution 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:

---

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

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.)

Solution 3

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

Comments

[sdrtyrty rtyuty]

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.