用php写一个进度条特效,jQuery实现的简单百分比进度条效果示例

彭弘方
2023-12-01

jQuery实现的简单百分比进度条效果示例,具体代码如下:

jQuery实现的简单百分比进度条效果示例

var progressId = "ProgressBarID", time = 30;

function setProgressBar(progress) {

if (progress) {

$("#" + progressId + " > div").css("width", String(progress) + "%");

$("#" + progressId + " > div").html(String(progress) + "%");

}

}

var i_ProgressBar = 0;

function doProgressBarLoading() {

if (i_ProgressBar > 100) {

console.log("加载完毕");

return;

}

if (i_ProgressBar <= 100) {

setTimeout("doProgressBarLoading()", time);

setProgressBar(i_ProgressBar);

i_ProgressBar++;

}

}

function setProgressBarCss() {

$("#" + progressId + "").css({"width": "300px", "height": "25px"});

$("#" + progressId + " > div").css({"height": "25px", "background-color": "#f03", "text-align": "center"});

}

$(document).ready(function () {

setProgressBarCss();

doProgressBarLoading();

});

 类似资料: