div+css滚动条

今天项目中用到了滚动条

<style>
span{display:inline-block;*display:inline-block;zoom:1;}//span的样式
.bg{width:300px;height:20px;border-radius:10px;background:#e3e3e3;}//整个滚动条的颜色
.main{height:20px;border-radius:10px;background:#37B5DD;}//随着百分比的数字变动 的颜色
 </style>

<span class="bg">
    <span class="main"></span>
</span>
<span class="num">70%</span>//这个可以放入动态的数字

<script>
$(function(){
    var _width = $('.num').text();//获取百分比数值
    $('.main').css('width',_width);//将数值赋值给main的width
});
</script>

 演示图