js进度条实例

 

jsp页面代码：test.jsp

<%@ page language="java" cOntentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

 

js代码：loading.js

//频率
var frequency = 50;
//步长  
var step = 3;
//背景颜色
var loadingBgcolor = "#FFFFEC";
//宽度
var loadingWidth = 354;

/*
*参数说明:
*content：显示内容，可以为空；
*imageURL：将引用JS文件的路径设置即可；
*left：进度条显示位置left
*top：进度条显示位置top
*/
function Loading(content,  imageURL, left, top)
{
 imageURL = imageURL + "Loading.jpg";
 
 LoadTable(content, imageURL, left, top);
 showimage.style.display="";
 window.setInterval("RefAct();", frequency);
} 

function RefAct()
{ 
 imgAct.width += step;
 if(imgAct.width > loadingWidth-4)
 {
  imgAct.width = 0;
 }
}

function LoadTable(content, imageURL, left, top)
{
 var strLoading;
 strLoading = "";
 strLoading += "

";

 document.getElementById("loading_div").innerHTML = strLoading;
}