网站进度条完美解决方案

< BODY onload = loadBar( 0 ) >
< SCRIPT language = javascript src = " loadbar.js " ></ SCRIPT >

< DIV id = loader style = " DISPLAY: none; Z-INDEX: 100; POSITION: absolute " >
< TABLE style = " FILTER: Alpha(opacity=90) "  onclick = loadBar( 0 ) cellSpacing = 1  
cellPadding = 5  bgColor = #bbbbb border = 0 >
   < TBODY >
   < TR >
     < TD align = left bgColor = #ffffff >
       < P >< IMG style = " MARGIN: 3px "  alt = 请等待 src = " load.gif "  
      align = left >< STRONG > 数据载入中... </ STRONG ></ P ></ TD ></ TR ></ TBODY ></ TABLE ></ DIV >
< SCRIPT language = javascript type = text / javascript > loadBar( 1 ); </ SCRIPT >

====================================================

这个为用于显示进度条的图片，特别漂亮

====================================================

进度条的js文件：loadbar.js

function  loadBar(fl)
// fl is show/hide flag
... {
  var x,y;
  if (self.innerHeight)
  ...{// all except Explorer
    x = self.innerWidth;
    y = self.innerHeight;
  }
  else 
  if (document.documentElement && document.documentElement.clientHeight)
  ...{// Explorer 6 Strict Mode
   x = document.documentElement.clientWidth;
   y = document.documentElement.clientHeight;
  }
  else
  if (document.body)
  ...{// other Explorers
   x = document.body.clientWidth;
   y = document.body.clientHeight;
  }

    var el=document.getElementById('loader');
    if(null!=el)
    ...{
        var top = (y/2) - 50;
        var left = (x/2) - 150;
        if( left<=0 ) left = 10;
        el.style.visibility = (fl==1)?'visible':'hidden';
        el.style.display = (fl==1)?'block':'none';
        el.style.left = left + "px"
        el.style.top = top + "px";
        el.style.zIndex = 2;
    }
}

转载于:https://www.cnblogs.com/Ewin/archive/2008/05/15/1199170.html