Some people seem to be a little bit unhappy with the way the default jQuery Mobile loading ajax spinner rotates. Luckily, this can be changed easily by contorlling the css animation settings. Here are three simple variations.
Works only in Safari and Chrome:
variation 1 (jQuery Mobile standard):
variation 2 (ease-in-out spun over multiple rotations):
variation 3 (linear):
CSS for variations 2 and 3:
.jqm-spin-demo .spin.var2 {
-webkit-animation-name: spin_var2;
-webkit-animation-duration: 12s;
}
@-webkit-keyframes spin_var2 {
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(3600deg);}
}
.jqm-spin-demo .spin.var3 {
-webkit-animation-timing-function: linear;
}