Transform progressbar with scale instead of changing width

This commit is contained in:
shortcutme 2018-03-29 02:42:57 +02:00
parent 0c985a5fda
commit 30ab2cf9a7
No known key found for this signature in database
GPG key ID: 5B63BAE6CB9613AE
2 changed files with 8 additions and 4 deletions

View file

@ -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

View file

@ -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);
}; };