improving loading icon
This commit is contained in:
parent
b74c5bee15
commit
4f2dc7dd53
2 changed files with 29 additions and 13 deletions
|
@ -660,9 +660,19 @@ Requests
|
||||||
|
|
||||||
.OxLoadingIcon {
|
.OxLoadingIcon {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
-moz-user-select: none;
|
||||||
|
-webkit-user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.OxLoadingIcon.OxLarge {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
.OxLoadingIcon.OxMedium {
|
.OxLoadingIcon.OxMedium {
|
||||||
width: 16px;
|
width: 16px;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
}
|
}
|
||||||
|
.OxLoadingIcon.OxSmall {
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
}
|
||||||
|
|
|
@ -3215,9 +3215,9 @@ requires
|
||||||
.addClass(
|
.addClass(
|
||||||
"OxLoadingIcon Ox" + Ox.toTitleCase(self.options.size)
|
"OxLoadingIcon Ox" + Ox.toTitleCase(self.options.size)
|
||||||
);
|
);
|
||||||
|
self.count = 0;
|
||||||
self.deg = 0;
|
self.deg = 0;
|
||||||
function update() {
|
function update() {
|
||||||
Ox.print(self.deg, "deg");
|
|
||||||
that.css({
|
that.css({
|
||||||
MozTransform: "rotate(" + self.deg + "deg)",
|
MozTransform: "rotate(" + self.deg + "deg)",
|
||||||
WebkitTransform: "rotate(" + self.deg + "deg)"
|
WebkitTransform: "rotate(" + self.deg + "deg)"
|
||||||
|
@ -3225,20 +3225,26 @@ requires
|
||||||
}
|
}
|
||||||
that.start = function() {
|
that.start = function() {
|
||||||
self.deg = 0;
|
self.deg = 0;
|
||||||
that.css({
|
self.count++;
|
||||||
opacity: 1
|
if (self.count == 1) {
|
||||||
});
|
self.interval = setInterval(function() {
|
||||||
self.interval = setInterval(function() {
|
self.deg = (self.deg + 30) % 360;
|
||||||
self.deg = (self.deg + 30) % 360;
|
update();
|
||||||
update();
|
}, 83);
|
||||||
}, 83);
|
that.animate({
|
||||||
|
opacity: 1
|
||||||
|
}, 250);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
that.stop = function() {
|
that.stop = function() {
|
||||||
clearTimeout(self.interval);
|
self.count--;
|
||||||
self.deg = 0;
|
if (self.count == 0) {
|
||||||
that.css({
|
clearTimeout(self.interval);
|
||||||
opacity: 0
|
self.deg = 0;
|
||||||
});
|
that.animate({
|
||||||
|
opacity: 0
|
||||||
|
}, 250);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return that;
|
return that;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue