I have multiple actions to perform and I am using bootstrap progress bar to show the progress on each action. After the completion of each action the progress bar is set to zero using the below line of code $('.progress').attr('style', "width: 0%")
But, this animates reverse, for users it looks like application is undoing an action performed previously.
How do I reset the progress bar instantly without the reverse animation effect?
You can remove the transitions of progress-bar as described in this answer
.notransition {
-webkit-transition: none !important;
-moz-transition: none !important;
-o-transition: none !important;
-ms-transition: none !important;
transition: none !important;
}
$(".progress-bar").addClass("notransition");
$('.progress-bar').attr('style', "width: 0%");
and if you want you can enable transitions again by removing notransition class
$(".progress-bar").removeClass("notransition");
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.