How do I create a splash screen video with Cordova (like Spotify / Uber)


#1

I’d like to create a splash screen with a background video on autoplay. In Chrome, this (sort of) works… Using the HTML5 video tag I was able to get it working in chrome using ionic serve.

After compiling it to Cordova, a few problems emerge:
The video autoplays, and for a moment I see my logo which should be on top of the video, but the video goes into fullscreen mode, and I lose visibility on my logo registration and login button. (due to it going full screen) If I now click my screen, again I see the video controls interface elements from iphone. If I click on fullscreen (exit fullscreen) I see my logo registration and login button, with a still frame of the video in the background (at least the layering is correct now).

So my questions are:
[1] How do I embed a video such that it is able to run in fullscreen in the background (a logo and 2 buttons on top of it using z-index)
[3] Can I do this with the HTML5 video tag or do I need another solution for this?

Thanks.


#2

I am unsure whether there are any plugins built for this, but a quick search returned this:

Note this is for android, unsure if it is similar in ios.


#3

Hi MachineMan,

Have you created a splash screen video?


#4

Any update on the video based splash screen from Ionic ?