Page 2 of 2

loading spinner + message

Posted: Wed Jun 19, 2013 4:13 pm
by 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.


loading spinner + message

Posted: Wed Jun 19, 2013 5:05 pm
by Kapow36

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


loading spinner + message

Posted: Thu Jun 20, 2013 1:01 pm
by 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.


loading spinner + message

Posted: Thu Jun 20, 2013 2:26 pm
by 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.


loading spinner + message

Posted: Thu Jun 20, 2013 2:28 pm
by 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.


loading spinner + message

Posted: Mon Jul 08, 2013 2:53 pm
by 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


loading spinner + message

Posted: Mon Jan 06, 2014 4:42 am
by 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.


loading spinner + message

Posted: Mon Jan 06, 2014 9:25 am
by Kateryna Grynko

Hi,

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


loading spinner + message

Posted: Mon Jan 06, 2014 1:41 pm
by Maryna Brodina

Hello! Thank you for sharing that!