动态加载进度条 java_动态显示进度条

可以将下边的代码嵌入到html,jsp,asp,php或aspx文件中！

截图

代码如下：

if(window.ActiveXObject) document.execCommand("BackgroundImageCache",false,true);

function ProcessBar(){

this.width = 256;

this.height = 18;

this.top = 0;

this.left = 0;

this.backImg = "process_back.gif";

this.foreImg = "process.gif";

this.backDiv = document.createElement("div");

this.foreDiv = document.createElement("div");

this.fontDiv = document.createElement("div");

this.isMoving = false;

this.nowLength = 0;

this.moveInterval = 100;

this.moveRange = 1;

this.timer;

ProcessBar.nowObj = this;

this.init = function(){

this.foreDiv.style.backgroundImage = "url(" + this.foreImg + ")";

this.foreDiv.style.backgroundRepeat = "no-repeat";

this.foreDiv.style.position = "absolute";

this.foreDiv.style.width = this.nowLength;

this.foreDiv.style.height = this.height;

this.foreDiv.style.top = 0;

this.foreDiv.style.left = 0;

this.fontDiv.style.background = "transparent";

this.fontDiv.style.position = "absolute";

this.fontDiv.style.width = this.width;

this.fontDiv.style.height = this.height;

this.fontDiv.style.top = 2;

this.fontDiv.style.left = 0;

this.fontDiv.style.textAlign = "center";

this.fontDiv.style.fontSize = "13px";

this.fontDiv.appendChild(document.createTextNode(" "));

this.backDiv.style.backgroundImage = "url(" + this.backImg + ")";

this.backDiv.style.backgroundRepeat = "no-repeat";

this.backDiv.style.position = "absolute";

this.backDiv.style.width = this.width;

this.backDiv.style.height = this.height;

this.backDiv.style.top = this.top;

this.backDiv.style.left = this.left;

this.backDiv.appendChild(this.foreDiv);

this.backDiv.appendChild(this.fontDiv);

document.body.appendChild(this.backDiv);

}

this.changeMode = function(){

this.isMoving = !this.isMoving;

if(this.isMoving){

this.timer = window.setInterval(ProcessBar.nowObj.moving, this.moveInterval);

}else{

window.clearInterval(this.timer);

}

}

this.moving = function(){

ProcessBar.nowObj.nowLength += ProcessBar.nowObj.moveRange;

ProcessBar.nowObj.foreDiv.style.width = ProcessBar.nowObj.nowLength;

ProcessBar.nowObj.fontDiv.firstChild.data = Math.ceil((ProcessBar.nowObj.nowLength/ProcessBar.nowObj.width )*100) + "%";

if(ProcessBar.nowObj.nowLength >= ProcessBar.nowObj.width ){

window.clearInterval(ProcessBar.nowObj.timer);

ProcessBar.nowObj.fontDiv.firstChild.data = "Complete!";

}

}

}

var processBar = new ProcessBar();

processBar.backImg = "http://screenprint2007.cpp114.com/UserFiles/20070412155452218.gif";

processBar.foreImg = "http://screenprint2007.cpp114.com/UserFiles/20070412155424937.gif";

processBar.top = 100;

processBar.left = 20;

processBar.init();

posted on 2008-05-10 09:34 鲁胜迪 阅读(360) 评论(0)  编辑  收藏