Background video IE11 flickers black on page load

[coolhandluke (Luke)]

Hello,

I’ve been doing some testing with IE11 and have run into a few issues. With the background video element, there is a black screen delay when loading the video. This doesn’t happen on Chrome or Firefox. Anyone else experiencing this?

I’m on latest Windows 8.1.
My Internet Explorer is version 11.0.9600.18427

Link to published site
http://ie11-bg-video-bug.webflow.io

Link to video showing the problem
https://webmshare.com/play/wwWmj

Share link
https://preview.webflow.com/preview/ie11-bg-video-bug?preview=cfc888e29160f657a6fd5a02284dab2a

Thanks,
Luke

[cyberdave (Dave Sloane)]

Hi @coolhandluke, thanks a lot for the info. I spent some time yesterday, trying different things, and I was not successful to get rid of that black poster attribute, it seems that what is happening, is that IE is briefly showing the image that is created as part of the data-poster attribute, and then switches to the video and there is a momentary time period where this blank frame is shown.

I have not found a workaround for this, it seems to be only affecting to IE 11. IE 11 by the way does render sites differently than other browsers and seems to have more issues with background video than other browsers, from the research I have done on the net.

Another option is to re-encode the video, it could be that IE does not like the encoding so well, so is showing that black space due to that. If you could send me the original video file, via we transfer or just email it to me, I will re-encode and do a test with that. I was able to reproduce the issue with the original issue (also Waldo did too) and now I want to test with a new re-encode.

Thanks in advance!