我正在尝试实现一个滑动进度条。我希望进度逐渐增加。
我尝试:
HTML
<div id="progressKeeper">
<div id="progress"></div>
</div>
CSS
#progressKeeper {
width: 800px;
height: 25px;
border: 3px double #003366;
margin: 0px 10px;
padding: 3px;
}
JavaScript
var el = $('#progress');
var steppedIncreaseAmount = ($('#progressKeeper').width()) / 100;
for (var i = 0; i < 100; i++) {
el.width(el.width() + steppedIncreaseAmount+ 'px');
}
看到这个jsfiddle
但它只是突然增加。我想要一个平滑的效果,就像一个淡入淡出。