Preloader component not working correctly

[John-Henrique]

This is my example. When run this the preloader isn't displayed.

phonon.preloader( '#carregando' ).show();

$.ajax({
    url: config.api() +"/v1/share/", 
    method: 'GET', 
    data: {
        app: "mexxxages"
    }
}).done(function(retorno){

    phonon.preloader( '#carregando' ).hide();

}).fail(function( jxhr, status, statusText ){

    phonon.preloader( '#carregando' ).hide();
});

I have this into div.content

        <div class="circle-progress" id="carregando">
            <div class="spinner"></div>
        </div>

[qathom]

Hi @John-Henrique,

Thank you for reporting this. :) Your code is working on my browser (Chrome v49.0).. maybe other "fixed or absolute" elements are visible before your circle-progress? Otherwise, on which device/browser are you testing this code?

<div class="circle-progress" id="carregando">
    <div class="spinner"></div>
</div>

[John-Henrique]

In browser works fine, but in Android no. Android 4.01 Running in app Cordova.

[qathom]

I see. Please, can you try the latest version (1.2.2)? I think that some CSS3 properties did not work properly because android 4 was missing with gulp autoprefixer. I changed it with the following options:

autoprefixer({ browsers: ['last 3 versions', 'ios 6', 'ios 7', 'ie 8', 'ie 9', 'android 4'] })

[sabatesduran]

I tested the version 1.2.2 with Android 5.1.1 and it doesn't work too.

[John-Henrique]

@Qathom really don't work too in 1.2.2 (Android 4.0.1)

[John-Henrique]

I don't know why, but I put this

<div class="loading">Loading&#8230;</div>

into .content and works perfectly. :neutral_face:

Not work if put

        <div class="circle-progress loading" id="carregando">
            <div class="spinner"></div>
        </div>

[qathom]

Hi @sabatesduran and @John-Henrique,

I tested the circle progress on my emulators running Android 5.1.1 and Android 4.1.1. This component is working fine..

Do you get any (JS) errors?

[John-Henrique]

No JS errors.