We can easily add background video to our apps.
Step 1: ionic start VideoIntro blank –v2
Step 2: We need to download the video from http://coverr.co website and add the download file assets folder of src.
Step 3: Inside the src/index.html add following code
before the http://cordova.js and add the following animate.css file
before the body and head tag.
Step 4: Add the following code in home.html
In the video tag, we have a new attribute called webkit-playsinline. This means that you want the video to play where it is on the HTML page and not open it up full screen with the play control. The reason is that we want this video to play in the background, while we can animate text on top of it. This is the reason we need to enable this feature by setting AllowInlineMediaPlayerback in config.xml
We have class animated and zoomIn Classes include in home template, these class are from animate.css
Step 5: Add the following code in home.scss
Step 6: We need to add the following code inside widget section of config.xml file.