don't use animated loading icon svg (consumes 100% cpu in recent versions of chrome)
This commit is contained in:
parent
f033877f41
commit
4b454790d5
1 changed files with 18 additions and 16 deletions
|
@ -25,21 +25,23 @@ Ox.LoadingIcon = function(options, self) {
|
||||||
'OxLoadingIcon Ox' + Ox.toTitleCase(self.options.size)
|
'OxLoadingIcon Ox' + Ox.toTitleCase(self.options.size)
|
||||||
);
|
);
|
||||||
|
|
||||||
self.setOption = function(key, value) {
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
/*@
|
/*@
|
||||||
start <f> Start loading animation
|
start <f> Start loading animation
|
||||||
() -> <f> Loading Icon Element
|
() -> <f> Loading Icon Element
|
||||||
@*/
|
@*/
|
||||||
that.start = function() {
|
that.start = function() {
|
||||||
that.attr({
|
var deg = 0;
|
||||||
src: Ox.UI.getImageURL('symbolLoadingAnimated')
|
if (!self.loadingInterval) {
|
||||||
})
|
self.loadingInterval = setInterval(function() {
|
||||||
.animate({
|
deg = (deg + 30) % 360;
|
||||||
opacity: 1
|
that.css({
|
||||||
}, 250);
|
OTransform: 'rotate(' + deg + 'deg)',
|
||||||
|
MozTransform: 'rotate(' + deg + 'deg)',
|
||||||
|
WebkitTransform: 'rotate(' + deg + 'deg)'
|
||||||
|
});
|
||||||
|
}, 83)
|
||||||
|
that.animate({opacity: 1}, 250);
|
||||||
|
}
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -48,13 +50,13 @@ Ox.LoadingIcon = function(options, self) {
|
||||||
() -> <f> Loading Icon Element
|
() -> <f> Loading Icon Element
|
||||||
@*/
|
@*/
|
||||||
that.stop = function() {
|
that.stop = function() {
|
||||||
that.animate({
|
var loadingInterval = self.loadingInterval;
|
||||||
opacity: 0
|
if (self.loadingInterval) {
|
||||||
}, 250, function() {
|
self.loadingInterval = void 0;
|
||||||
that.attr({
|
that.animate({opacity: 0}, 250, function() {
|
||||||
src: Ox.UI.getImageURL('symbolLoading')
|
clearInterval(loadingInterval);
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue