jQuery mobile loading wheel does not works in some browsers

Question

I'm using the lines like:

$.mobile.loading('show');

and

$.mobile.loading('hide');

with jquery.mobile-1.2.0.js.

It works in Firefox, but not in Chrome(Version 26) and Safari(5.1.7) on Windows. Is it browser specific?

Answer 1

jQuery Moible has a problem with web-kit browsers, so if any page event (except pageshow) is used, ajax loader will only work if executed with setinterval:

Here's a working example: http://jsfiddle.net/LW7MU/

$(document).on('pagebeforeshow', '#index', function(){  
    var loader = setInterval(function(){
        $.mobile.loading('show');
        clearInterval(loader);
    },1);       
});

As I have mentioned earlier ajax loader will be successfully shown in Chrome and Safari ig pageshow event is used, example: http://jsfiddle.net/8ay3W/1/

This code can also be safely used in Firefox and mobile browsers.

This was specific to Chrome and Safari from the first jQM version, no matter using the old version of alax loader triggering or this new one with $.mobile.loading('show').

There are few other similar problems. This is also the only way jQM popup can be programatically turned on/off.