Does anybody know how to hide the grey play button on background videos on devices that do not allow auto play please. I want the background video to be eye candy only and it’s not important that it plays, however I do want it to auto play on devices that it allows it on, and therefore do not want to replace with an image for devices. The problem is I have another button over the background video for a different interaction and the automated play button is interfering (visually) with my desired button. I do need to be mindful that disabling the button on this instance and will not affect any other types of play buttons throughout the website. The site is for a visual effects company and so there are many uses of video including, vimeo and youtube links. Please let me know if you have a solution for this. Much appreciated.
If you don’t like the way a built-in component works, your only other option is to use custom code. There are topics in the forum about custom background videos. You have to come up with a place to host video. I like using cloudinary and vimeo. Basically you are just using the HTML5 video element.
See this post for an example -> BG Video - Code for Amazon hosted video
Hi thank you for the reply, I’d prefer not to have to host it elsewhere, and would ideally like to use the built in component, I was just wondering if there was a piece of code that would hide the button. If anyone knows if this is possible that would be super helpful. I also just noticed that the play button in background video doesn’t seem to work on an iPhone with battery power save mode on, which is the only time that the button shows anyway which seems unusual. Do you happen to know why this would be? Thank you
This is the reference I go to for Safari; macOS and iOS). As
Thank you for the info, I will try to get my head around it.