Take the 2-minute tour ×

By default the JQM (JQueryMobile) loading div tag you can optionally call up is aligned in the center of the page. This is how you call it up:

 $.mobile.loadingMessage = 'Doing Something...';
 $.mobile.loadingMessageTextVisible = true;

A call to hidePageLoadingMsg() will remove it.

Some info about how the loading icon is created by JQM and displayed can be seen here: How can I style jquery mobile loading spinner

The problem I'm having is getting it to align on the right of the page (or left) in a dynamic resolution independent way.

I can overload the CSS for the loading div:


However adjusting the margins for example are to resolution dependent. What I mean is I can right align it on desktop but it breaks on mobile now.

Any help appreciated.

UPDATE: The full JQM implementation of the loader is here: https://github.com/jquery/jquery-mobile/blob/master/js/widgets/loader.js

share|improve this question
tried fixed positioning ? –  sabithpocker Dec 4 '12 at 0:12
Unless I'm using it wrong this won't work. I can use this method to make it look great on Desktop but switch to a mobile device and it needs to be adjusted. –  Halsafar Dec 4 '12 at 0:34
I think JQM is applying some more styles. The fixed method you linked to should work but it doesn't move the div. –  Halsafar Dec 4 '12 at 0:37
add comment


Your Answer



Browse other questions tagged or ask your own question.