loading spinner + message

[Kateryna Grynko]

There is no a built-in solution. But you can replace the standard call show|hideSpinner with your custom code, which will lay a spinner under another layer to transparent cover the entire screen.

[Kapow36]

Ok thanks, I've got something working now. I just removed the spinner from Neil's code

[Emmz]

Just tweak the code to suit screen size.
This design was based on a galaxy s2 screen
code
function spinnerFull(screen,text) {
//FULL SCREEN Ajax spinner... Disables entitre screen and centers loader gif
//Sets Background opacity, size etc.
var cssBack = {'background-color':'white','opacity':'0.3','width':'320','height':'470','top':'0px','position':'absolute','z-index':'2000'};
//Sets Spinner
/code
Snipit from code above. Change height opacity or whatever u like.

[Kapow36]

Yeah that's what I did thanks. However, I did change the width and height to 100% so it doesn't matter what device is used.

[Kapow36]

Yeah that's what I did thanks. However, I did change the width and height to 100% so it doesn't matter what device is used.

[Kapow36]

Just for everyone's benefit, I found an easier way to make a backdrop for the jquery spinner.

Just add this to your custom css file and modify as needed...

code
.ui-loader {
width: 110%;
height: 110%;
top:15px !important;
left:15px !important;
opacity:1;
background: rgba(0,0,0, .9);
}
.ui-loader > span {
position: fixed;
top: 50%;
left: 50%;
margin: -26px !important;
opacity:.5;
}
/code

[m z]

I'm interested in removing the Appery spinner and using the JQM version. Is there an easy way to disable the Appery spinner? Right now, both are showing resulting in a clumsy user experience.

[Kateryna Grynko]

Hi,

You can use JavaScript. To show spinner: preshowSpinner();/pre To hide it: prehideSpinner();/pre

[Maryna Brodina]

Hello! Thank you for sharing that!