Add Splash splash page_html/css_WEB-ITnose to your Cordova HybridApp

The latest version of Cordova 3 or above now supports the splash screen, which is implemented through the cordova plug-in.

Currently, the Splash plug-in supports multiple platforms such as android, ios, and blackberry.

The process of adding plug-ins is as follows:

Add SplashScreen plug-in

Run in the cordova project directory:

cordova plugin add org.apache.cordova.splashscreen

This command downloads the plug-in code from the plug-in git library to the plugins directory of the project

Modify the config.xml configuration file

    <preference name="SplashScreen" value="screen" /> <!-- 不带后缀png的文件名，默认是screen-->    <preference name="SplashScreenDelay" value="3000" /> <!-- Splash显示时间，默认是3000ms-->    <feature name="SplashScreen">        <param name="android-package" value="org.apache.cordova.splashscreen.SplashScreen" />    </feature>

Modify the startup image

You can see that the name of the startup image is screen.png, and there are some screens under the project .png is the default image. The one shown above is the cordova logo. Next, you need to replace these images with your own startup screen. Just delete the images with unsupported sizes.

Hide the Splash screen after the device initialization is completed

document.addEventListener("deviceready", onDeviceReady, false);  function onDeviceReady() {    navigator.splashscreen.hide();  }  

If the ionic framework is used, directly in the .run of the app.js file (['$ionicPlatform', function ($ionicPlatform) { ... } Just add

navigator.splashscreen.hide();

.

Now run your App and you should see the splash screen.