HTML5 Video stack - remove overlay play button

1

Hello,

I am using Joe Workman’s HTML5 Video stack. I would like to remove the big play button which overlays the ‘Poster’ image. This question is addressed on the page https://www.weavers.space/answers/html5-video-big-button

I have entered the suggested CSS code ( .mejs-overlay-button {display: none;} ) into the CSS area but the play button continues to show. Any ideas? Alternative CSS perhaps?

2

Looks like it should have been .play-button.circle instead of .mejs-overlay-button

I.e. try:

.play-button.circle {display: none;}

3

Gary, Thank you for that suggestion. I have tried it out but it still shows up. Here is the page https://actorclivefrancis.com/adaptations/

I am also trying out Will Woodgates Player 2 stack on that page.

4

A link is always helpful.

You seem to have a different version to what’s on the WS product page, but ignoring that, you need to use :

.mejs__overlay {display: none;}

You had a - and it should have been 2 _'s, i.e. __

The original documentation is wrong BTW.

5

Thank you for the double underscore hint. adding -button to the above code you suggested made it disappear.

It is very kind of you Gary, to help me with that.

I will send a polite message to joe Workman and suggest he changes his suggested CSS code accordingly

1 Like