CODEWITHSUNDEEP
androidcordova
karnhick
karnhick

Reputation: 275

How to load css in phonegap before page display?

I am creating a Phonegap app. In my app am using different css for "Android" and "ios" so i have to load css only if it is android. The following code works perfectly but initially the page gets loaded without css and then after phonegap loads my css gets loaded which shows me a dancing page everytime when i display that page (i.e) css loads after the page displays.can anyone help to load the css before the page get displayed, but only if it is android platform.

     <script type="text/javascript" >
     var string;
     // Wait for PhoneGap to load 
     document.addEventListener("deviceready", onDeviceReady, false);

     // PhoneGap is loaded and it is now safe to make calls PhoneGap methods
     function onDeviceReady() 
     {
       check_img();
    }

   function check_img() 
   {
     string = device.platform;
    if(string=="Android")
    {
      var head  = document.getElementsByTagName('head')[0];
      var link  = document.createElement('link');
      //link.id   = cssId;
      link.rel  = 'stylesheet';
      link.type = 'text/css';
      link.href = 'css/style.css';
      //link.media = 'all';
      head.appendChild(link);
    }
    } 
    </script>

Upvotes: 2

Views: 1837

Answers (1)

karnhick
karnhick

Reputation: 275

I found answer here. http://simonmacdonald.blogspot.in/2012/04/phonegap-android-splashscreen-just-got.html

when you setup a splash screen you do the following in your mainactivity.java file 

    super.setIntegerProperty("splashscreen", R.drawable.splash);
    super.loadUrl("file:///android_asset/www/index.html", 10000);

This would show your splash screen 10 seconds then your index.html page would be loaded. Notice I said then. Yup, that's right showing the splash screen is a blocking call. While the splash screen is being displayed your .html/.js/.css is not being loaded in the background. Well, that is all changing so that your splash screen is shown on one thread while your application loads underneath the splash screen in another thread. The best thing is you don't need to make any changes to your code. Just keep calling the splash screen like you normally would.

Upvotes: 1

Related Questions