龙空技术网

进度条制作

阿毛杂记 388

前言:

现时看官们对“jquery漂亮的进度条”可能比较着重,同学们都需要剖析一些“jquery漂亮的进度条”的相关知识。那么小编也在网摘上搜集了一些对于“jquery漂亮的进度条””的相关资讯,希望兄弟们能喜欢,小伙伴们一起来学习一下吧!

前端进度条显示

最近在弄一个进度条操作,写着写着就弄成这个样子了

形象的进度条

首先得有bootstrap样式引用:

<link href="/static/css/bootstrap.css" rel="stylesheet" type="text/css" media="all">

其次是前端div标签展示,相当于两个嵌套显示

<div id="prog_out" class="progress progress-striped active">

<div id="prog_in" class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="0"

aria-valuemin="0" aria-valuemax="100" style="width: 0%;">

</div>

</div>

然后需要整理JQuery代码部分:

注意:这里是加载整个文档时调用,这个根据个人情况来定。

for (var i = 0, i<100, i++){

$('#prog_in').width(i + '%')

}

不知道大佬们有没有别的更好的方法,我想找个更好的,5555…………………………

标签: #jquery漂亮的进度条