Transform progressbar with scale instead of changing width
This commit is contained in:
parent
0c985a5fda
commit
30ab2cf9a7
2 changed files with 8 additions and 4 deletions
|
@ -8,12 +8,12 @@ class Loading
|
||||||
if @timer_hide
|
if @timer_hide
|
||||||
clearInterval @timer_hide
|
clearInterval @timer_hide
|
||||||
RateLimit 200, ->
|
RateLimit 200, ->
|
||||||
$(".progressbar").css("width", percent*100+"%").css("opacity", "1").css("display", "block")
|
$(".progressbar").css("transform": "scaleX(#{parseInt(percent*100)/100})").css("opacity", "1").css("display", "block")
|
||||||
|
|
||||||
hideProgress: ->
|
hideProgress: ->
|
||||||
console.log "hideProgress"
|
console.log "hideProgress"
|
||||||
@timer_hide = setTimeout ( =>
|
@timer_hide = setTimeout ( =>
|
||||||
$(".progressbar").css("width", "100%").css("opacity", "0").hideLater(1000)
|
$(".progressbar").css("transform": "scaleX(1)").css("opacity", "0").hideLater(1000)
|
||||||
), 300
|
), 300
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -587,7 +587,9 @@ jQuery.extend( jQuery.easing,
|
||||||
clearInterval(this.timer_hide);
|
clearInterval(this.timer_hide);
|
||||||
}
|
}
|
||||||
return RateLimit(200, function() {
|
return RateLimit(200, function() {
|
||||||
return $(".progressbar").css("width", percent * 100 + "%").css("opacity", "1").css("display", "block");
|
return $(".progressbar").css({
|
||||||
|
"transform": "scaleX(" + (parseInt(percent * 100) / 100) + ")"
|
||||||
|
}).css("opacity", "1").css("display", "block");
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -595,7 +597,9 @@ jQuery.extend( jQuery.easing,
|
||||||
console.log("hideProgress");
|
console.log("hideProgress");
|
||||||
return this.timer_hide = setTimeout(((function(_this) {
|
return this.timer_hide = setTimeout(((function(_this) {
|
||||||
return function() {
|
return function() {
|
||||||
return $(".progressbar").css("width", "100%").css("opacity", "0").hideLater(1000);
|
return $(".progressbar").css({
|
||||||
|
"transform": "scaleX(1)"
|
||||||
|
}).css("opacity", "0").hideLater(1000);
|
||||||
};
|
};
|
||||||
})(this)), 300);
|
})(this)), 300);
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in a new issue