想实现一个动态加载的进度条，目前希望能分成17行，动态显示，大家看看能不能实现？

想实现一个动态加载的进度条，目前希望能分成17行，动态显示，大家看看能不能实现？
 
<script   src='http://code.jquery.com/jquery-1.4.2.min.js'></script>
<script>
function showEndTime()
{
var TOTAL=61200;
  var a=new Date();
  var t1=a.getTime();
  var d = new Date(a.getFullYear(), a.getMonth() , a.getDate(),6,30, 0, 0);
  var elapsedTime=(t1-d)/1000;
  var leftTime=TOTAL-elapsedTime;
  $('#spTimeStamp').html('Attention   from 6:30 to 23:30\n\n\n\t'+'<br/>'+  ( parseInt(elapsedTime*10)/10).toFixed(1).toString()    +'_______'+  leftTime.toFixed(1)    ); 
 $('#spTimeStamp').css('color','red')
$('#leftBar').css('width', 900*elapsedTime/TOTAL +'px').html( ( parseInt(elapsedTime*10)/10).toFixed(1).toString() ).css('text-align','right');
$('#rightBar').css('width',900*leftTime/TOTAL+'px').html(   leftTime.toFixed(1) ).css('text-align','left');}
 window.setInterval(showEndTime,10);
</script><div id='spTimeStamp'>
</div>
<div  style='display:inline'>
 <span id='leftBar' style='background:red;width:200px;height:20px;display:block;float:left;'> </span>
 <span id='rightBar' style='background:blue;width:200px; height:20px;display:block;float:left;'> ff</span>
</div>