5
I’m performing various imports, and when I perform upload of a new file I need to reset the progress, this I can set the width with 0px, however it Zera with an effect in which I would not like to use.
Example:
var progressBar = $(".progress-bar");
var acionaProgresso = setInterval(addProgress, 1000);
function addProgress() {
var width = progressBar.width() + 40;
progressBar.width(width);
}
$("#zeraProgressBar").click(function() {
progressBar.width('0%');
clearInterval(acionaProgresso);
});<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div class="container">
<br>
<h4 class="text-center">Importando arquivos</h4>
<div class="container">
<div class="progress">
<div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100">
<span class="sr-only"></span>
</div>
</div>
</div>
<div class="text-center">
<br>
<br>
<button class="btn btn-primary" id="zeraProgressBar">
Zerar Progress Bar
</button>
</div>
</div>How can I clear progress without using this effect ?
It’s "gambiarra", but I think the only way is to put an id in your bar, select it by jquery, disable the animation by putting None, and then remove it from the animation property, so it can use what comes from the bootstrap’s progressibar scroll.
– DH.