console
var bar = document.getElementById("bar")
var width = 1
function clamp(value, min, max) {
if (value > max) return max;
else if (value < min) return min;
else return value
}
setInterval(function(){
bar.style.width = width + '%'
var increment = 10 * Math.random()
width+=clamp(increment, 0, 90 - width)
},1000)
<div id="container">
<div id="bar"></div>
</div>
#container {
width: 300px;
height: 50px;
border: 1px solid blue;
}
#bar {
height: 100%;
width:100%;
background-color: red;
transition-property: width;
transition-duration: 0.5s;
transition-timing-function: ease;
}