All geek questions in one place

Remove the black background from the html5 video. Appears for a second

How can I remove black background from html5 video? It is displayed for several seconds at boot time. Using CSS does not work.

HTML:

<div id="start-screen"> <video id="video-element"> <source src="video-mp4.mp4" type="video/mp4"> <source src="video-oggtheora.ogv" type="video/ogg"> </video> </div>

CSS (not working):

 #start-screen, video-element { background-color: #fff !important; }

Thanks!

+6
source share
1 answer

I did not find a working solution with CSS. But I found that using a very small white (or any other color) poster image does the trick. Therefore, if you have the same problem as I did. I just used a PNG file of size 100x100 pixels (~ 1 KB).

 <div id="start-screen"> <video id="video-element" poster="/images/white-poster-image.png"> <source src="video-mp4.mp4" type="video/mp4"> <source src="video-oggtheora.ogv" type="video/ogg"> </video> </div>

Good luck

+9
source

Source: https://habr.com/ru/post/973166/

More articles:


All Articles