BootStrap初学者对弹出框和进度条的使用感觉
Bootstrap，来自Twitter，是目前最受欢迎的前端框架。Bootstrap是基于HTML、CSS、JAVASCRIPT的，它简洁灵活，使得Web开发更加快捷。
bootstrap框架提供的进度条，如菜鸟教程里面的这些代码
<divclass="progress"> <divclass="progress-bar"role="progressbar"aria-valuenow="60" aria-valuemin="0"aria-valuemax="100"style="width:40%;"> <spanclass="sr-only">40%完成</span> </div> </div>
让我这种真正的菜鸟一开始不知道该如何....让其变为真正的进度条。不过进过百度几下别人的之后，只要这个是要添加jquery代码配合之下才能实现滴。我度呀度，终于实现如下，略带高兴。
<divclass="modalfade"id="myModal1"tabindex="-1"role="dialog" aria-labelledby="myModalLabel"aria-hidden="true"data-backdrop="static"style="width:300px"> <divclass="modal-dialog"> <divclass="modal-content"> <spanstyle="text-align:center;color:red">文件正在上传请勿刷新页面！</span><br/> <divclass="progressprogress-stripedactive"> <divclass="bar"> </div> </div> </div> </div> </div>
上面这段是，用弹出框里面包含进度条。不然怎么实现一个开始让其隐藏的呢？在用bootstrap做进度条，或者固定的弹出框时，加上data-backdrop="static"这句比较好，因为没有这个修饰，你只要点击下鼠标，弹出框就消失不见了。
<scripts>
varp=101;
varstop=1;
functionrun(){
p+=4;
$("div[class=bar]").css("width",p+"%");
vartimer=setTimeout("run()",500);
if(p>100&&stop<1){
p=0;
}
}
$('#BtnSubmit').click(function(){
$('#myModal1').modal('show');
p=0;
stop=0;
run();
$('#UpLoad').submit();
});
</scripts>
其实，bootstrap的进度条是通过css样式进行展现的，所以只要不断滴修改，stylewidth的值，就可以显示出来。当然我这个循环，重现刷新页面才能重新隐藏掉进度条。若是，用post提交，然后根据返回值进行判断，然后用$('#myModal1').modal('hide');将其隐藏，stop的值相应滴就改为1，不然会在一直跑滴。