improving loading icon

This commit is contained in:
Rolux 2010-02-20 14:20:52 +05:30
parent f6e61a68fa
commit 31d13026fb
2 changed files with 29 additions and 13 deletions

View File

@ -660,9 +660,19 @@ Requests
.OxLoadingIcon {
opacity: 0;
-moz-user-select: none;
-webkit-user-select: none;
}
.OxLoadingIcon.OxLarge {
width: 20px;
height: 20px;
}
.OxLoadingIcon.OxMedium {
width: 16px;
height: 16px;
}
.OxLoadingIcon.OxSmall {
width: 12px;
height: 12px;
}

View File

@ -3215,9 +3215,9 @@ requires
.addClass(
"OxLoadingIcon Ox" + Ox.toTitleCase(self.options.size)
);
self.count = 0;
self.deg = 0;
function update() {
Ox.print(self.deg, "deg");
that.css({
MozTransform: "rotate(" + self.deg + "deg)",
WebkitTransform: "rotate(" + self.deg + "deg)"
@ -3225,20 +3225,26 @@ requires
}
that.start = function() {
self.deg = 0;
that.css({
opacity: 1
});
self.interval = setInterval(function() {
self.deg = (self.deg + 30) % 360;
update();
}, 83);
self.count++;
if (self.count == 1) {
self.interval = setInterval(function() {
self.deg = (self.deg + 30) % 360;
update();
}, 83);
that.animate({
opacity: 1
}, 250);
}
};
that.stop = function() {
clearTimeout(self.interval);
self.deg = 0;
that.css({
opacity: 0
});
self.count--;
if (self.count == 0) {
clearTimeout(self.interval);
self.deg = 0;
that.animate({
opacity: 0
}, 250);
}
}
return that;
}