Trying to hide video controls

mgarcia
44 Posts
mgarcia posted this 20 June 2018

Hello, thanks for such a great product.
Im trying to add a CSS to hide video progress bar and audio controls on my homepage video.
However it doesnt work. Im inserting this code in Settings > Additional Settings but it doesnt work,
please help

audio::-webkit-media-controls-timeline,
video::-webkit-media-controls-timeline {


    display: none;
}
audio::-webkit-media-controls,
video::-webkit-media-controls {


    display: none;
}

Hello, thanks for such a great product. Im trying to add a CSS to hide video progress bar and audio controls on my homepage video. However it doesnt work. Im inserting this code in Settings > Additional Settings but it doesnt work, please help audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline { display: none; } audio::-webkit-media-controls, video::-webkit-media-controls { display: none; }

Last edited 20 June 2018 by mgarcia

Vote to pay developers attention to this features or issue.
11 Comments
Order By: Standard | Newest
Support Team
Support Team posted this 21 June 2018

Hi,

Please provide a link to the page where we could see those controls.

Sincerely,
Hella

Hi, Please provide a link to the page where we could see those controls. Sincerely, Hella
mgarcia
44 Posts
mgarcia posted this 21 June 2018

Hello Hella,

Sure, http://www.ipnoticias.com.pe
Let me know if you need the wp-admin access

Hello Hella, Sure, http://www.ipnoticias.com.pe Let me know if you need the wp-admin access
Support Team
Support Team posted this 21 June 2018

Hi,

Remove the controls attribute from the <video> tag and that will remove the bar.

Sincerely,
Hella

Hi, Remove the `controls` attribute from the `<video>` tag and that will remove the bar. Sincerely, Hella
mgarcia
44 Posts
mgarcia posted this 21 June 2018

Hello Hella,
Thanks for your prompt answer,. (sorry, Im a newbie at code) now its as this, but this doesnt work either.

audio::-webkit-media-controls-timeline,
{
    display: none;
}
audio::-webkit-media-controls,
{
    display: none;
}

Hello Hella, Thanks for your prompt answer,. (sorry, Im a newbie at code) now its as this, but this doesnt work either. audio::-webkit-media-controls-timeline, { display: none; } audio::-webkit-media-controls, { display: none; }
Support Team
Support Team posted this 21 June 2018

Hi,

I meant that the HTML code for the video includes the controlsattribute. You can find more information here:
https://stackoverflow.com/questions/14161516/html5-video-completely-hide-controls

Sincerely,
Hella

Hi, I meant that the HTML code for the video includes the `controls`attribute. You can find more information here: https://stackoverflow.com/questions/14161516/html5-video-completely-hide-controls Sincerely, Hella
mgarcia
44 Posts
mgarcia posted this 21 June 2018

Hello,
Im trying to add this to Addtional CSS, but seems theres a mistake.
Should I add it to Additional Head HTML?

<video width="1600" height="auto" autoplay="autoplay">
  <source src="ipnoticias.webm" type="video/webm" />
</video>

Hello, Im trying to add this to Addtional CSS, but seems theres a mistake. Should I add it to Additional Head HTML? <video width="1600" height="auto" autoplay="autoplay"> <source src="ipnoticias.webm" type="video/webm" /> </video>
Support Team
Support Team posted this 21 June 2018

Hi,

This is regular html which should be added inside page BODY. Therefore you should add it into the HTML control (Insert tab >> More). Insert this control to the template where you want the video to appear.

Additional CSS fields is for CSS and Additional HEAD HTML is for head html like meta tags.

Thank you,
Olivia

Hi, This is regular html which should be added inside page BODY. Therefore you should add it into the HTML control (Insert tab >> More). Insert this control to the template where you want the video to appear. Additional CSS fields is for CSS and Additional HEAD HTML is for head html like meta tags. Thank you, Olivia
mgarcia
44 Posts
mgarcia posted this 22 June 2018

Hello Olivia,
It works!
Thanks for the lights, I really appreciate it

Martin

Hello Olivia, It works! Thanks for the lights, I really appreciate it Martin
Support Team
Support Team posted this 22 June 2018

Hi Martin,

You're very welcome.
Please let us know if you have any further questions.

Thanks,
Ivan

Hi Martin, You're very welcome. Please let us know if you have any further questions. Thanks, Ivan
neuerloyed
1 Posts
neuerloyed posted this 10 November 2023

Hi,

I meant that the HTML code for the video includes the controlsattribute. You can find more information here:
https://stackoverflow.com/questions/14161516/html5-video-completely-hide-controls/geometry dash lite

Sincerely,
Hella
I succeeded, thank you very much. The link above is really helpful

> Hi, > > I meant that the HTML code for the video includes the `controls`attribute. You can find more information here: > https://stackoverflow.com/questions/14161516/html5-video-completely-hide-controls/[geometry dash lite][1] > > Sincerely, > Hella I succeeded, thank you very much. The link above is really helpful [1]: https://geometrydash-lite.io
namdosan1409
2 Posts
namdosan1409 posted this 10 November 2023

If you never hover over the video the controls are always visible. Hey Chase, Thanks for writing in. car games

If you never hover over the video the controls are always visible. Hey Chase, Thanks for writing in. [car games][1] [1]: https://cargames.one
You must log in or register to leave comments