home *** CD-ROM | disk | FTP | other *** search
/ Chip 2001 December / Chip_2001-12_cd1.bin / internet / archeo / js / progressbar.js < prev    next >
Text File  |  2001-10-12  |  6KB  |  130 lines
  1. // Progressbar - Version 2.0
  2. // Author: Brian Gosselin of http://scriptasylum.com
  3. // Featured on Dynamic Drive (http://www.dynamicdrive.com)
  4. // PUT THE NAMES OF ALL YOUR IMAGES THAT NEED TO BE "CACHED" IN THE "imagenames" ARRAY.
  5. // DONT FORGET THE COMMA BETWEEN EACH ENTRY, OR THE TICK MARKS AROUND EACH NAME.
  6. // WHEN ALL THE IMAGES ARE DONE LOADING, THE "imagesdone" VARIABLE IS SET TO "TRUE"
  7.  
  8. var imagenames=new Array( 
  9.         "images/top_16w.gif", "images/top_16.gif",
  10.         "images/top_11.gif", "images/top_13.gif",
  11.         "images/bottom_20w.gif", "images/bottom_20.gif",
  12.         "images/bottom_22w.gif", "images/bottom_22.gif",
  13.         "images/bottom_24w.gif", "images/bottom_24.gif",
  14.         "images/bottom_26w.gif", "images/bottom_26.gif",
  15.         "images/bottom_28w.gif", "images/bottom_28.gif",
  16.         "images/bottom_30w.gif", "images/bottom_30.gif",
  17. "aktuality_okno/flotaceakt.jpg", "aktuality_okno/kofl01.jpg",
  18.  "aktuality_okno/lakemungo01.jpg", "aktuality_okno/megalityakt.jpg",
  19.  "aktuality_okno/note01.jpg", "aktuality_okno/reporteriol01.jpg",
  20. "aktuality_okno/helfakt.jpg");
  21.  
  22.  
  23. var yposition=500;                                  //POSITION OF LOAD BAR FROM TOP OF WINDOW, IN PIXELS
  24. var loadedcolor='gray' ;                // PROGRESS BAR COLOR
  25. var unloadedcolor='white';                   // BGCOLOR OF UNLOADED AREA
  26. var barheight=15;                                 // HEIGHT OF PROGRESS BAR IN PIXELS (MIN 25)
  27. var barwidth=200;                                // WIDTH OF THE BAR IN PIXELS  
  28. var bordercolor='black';                       // COLOR OF THE BORDER
  29.  
  30.  
  31. //aded by medi
  32. var imgon1 = new Image();
  33. var imgot1 = new Image();
  34. var imgon2 = new Image();
  35. var imgot2 = new Image();
  36. imgon1.src="images/index_06l.gif";
  37. imgot1.src="images/index_06.gif";
  38. imgon2.src="images/index_02l.gif";
  39. imgot2.src="images/index_02.gif";
  40.  
  41. function isOver(number)
  42. {
  43.     str="imgon"+number+".src";
  44.     document.getElementById(number).src=eval(str);
  45. }
  46.  
  47. function isOut(number)
  48. {
  49.     str="imgot"+number+".src";
  50.     document.getElementById(number).src=eval(str);
  51. }
  52. //end by medi
  53.  
  54.  
  55.  
  56. //DO NOT EDIT BEYOND THIS POINT 
  57. var NS4 = (navigator.appName.indexOf("Netscape")>=0 && parseFloat(navigator.appVersion) >= 4 && parseFloat(navigator.appVersion) < 5)? true : false;
  58. var IE4 = (document.all)? true : false;
  59. var NS6 = (parseFloat(navigator.appVersion) >= 5 && navigator.appName.indexOf("Netscape")>=0 )? true: false;
  60. var imagesdone=false;
  61. var blocksize=barwidth/(imagenames.length);
  62. barheight=Math.max(barheight,5);
  63. var loaded=0, perouter, perdone, images=new Array();
  64. var txt=(NS4)?'<layer name="perouter" bgcolor="'+bordercolor+'" visibility="hide">' : '<div id="perouter" style="position:absolute; visibility:hidden; background-color:'+bordercolor+'">';
  65. txt+='<table cellpadding="0" cellspacing="1" border="0"><tr><td width="'+barwidth+'" height="'+barheight+'" valign="center">';
  66. if(NS4)txt+='<ilayer width="100%" height="100%"><layer width="100%" height="100%" bgcolor="'+unloadedcolor+'" top="0" left="0">';
  67. txt+='<table cellpadding="0" cellspacing="0" border="0"><tr><td valign="center" width="'+barwidth+'" height="'+barheight+'" bgcolor="'+unloadedcolor+'"><center><font color="'+loadedcolor+'" size="1" face="sans-serif">Loading Images...</font></center></td></tr></table>';
  68. if(NS4) txt+='</layer>';
  69. txt+=(NS4)? '<layer name="perdone" width="100%" height="'+barheight+'" bgcolor="'+loadedcolor+'" top="0" left="0">' : '<div id="perdone" style="position:absolute; top:1px; left:1px; width:'+barwidth+'px; height:'+barheight+'px; background-color:'+loadedcolor+'; z-index:100">';
  70. txt+='<table cellpadding="0" cellspacing="0" border="0"><tr><td valign="center" width="'+barwidth+'" height="'+barheight+'" bgcolor="'+loadedcolor+'"><center><font color="'+unloadedcolor+'" size="1" face="sans-serif">Loading Images...</font></center></td></tr></table>';
  71. txt+=(NS4)? '</layer></ilayer>' : '</div>';
  72. txt+='</td></tr></table>';
  73. txt+=(NS4)?'</layer>' : '</div>';
  74. document.write(txt);
  75. function loadimages(){
  76. if(NS4){
  77. perouter=document.perouter;
  78. perdone=document.perouter.document.layers[0].document.perdone;
  79. }
  80. if(NS6){
  81. perouter=document.getElementById('perouter');
  82. perdone=document.getElementById('perdone');
  83. }
  84. if(IE4){
  85. perouter=document.all.perouter;
  86. perdone=document.all.perdone;
  87. }
  88. cliplayer(perdone,0,0,barheight,0);
  89. window.onresize=setouterpos;
  90. setouterpos();
  91. for(n=0;n<imagenames.length;n++){
  92. images[n]=new Image();
  93. images[n].src=imagenames[n];
  94. setTimeout('checkload('+n+')' ,n*100);
  95. }}
  96. function setouterpos(){
  97. var ww=(IE4)? document.body.clientWidth : window.innerWidth;
  98. var x=(ww-barwidth)/2;
  99. if(NS4){
  100. perouter.moveTo(x,yposition);
  101. perouter.visibility="show";
  102. }
  103. if(IE4||NS6){
  104. perouter.style.left=x+'px';
  105. perouter.style.top=yposition+'px';
  106. perouter.style.visibility="visible";
  107. }}
  108. function dispbars(){
  109. loaded++;
  110. cliplayer(perdone, 0, blocksize*loaded, barheight, 0);
  111. if(loaded>=imagenames.length)setTimeout('hideperouter()', 800);
  112. }
  113. function checkload(index){
  114. (images[index].complete)? dispbars() : setTimeout('checkload('+index+')', 100);
  115. }
  116. function hideperouter(){
  117. (NS4)? perouter.visibility="hide" : perouter.style.visibility="hidden";
  118. imagesdone=true;
  119. }
  120. function cliplayer(layer, ct, cr, cb, cl){
  121. if(NS4){
  122. layer.clip.left=cl;
  123. layer.clip.top=ct;
  124. layer.clip.right=cr;
  125. layer.clip.bottom=cb;
  126. }
  127. if(IE4||NS6)layer.style.clip='rect('+ct+' '+cr+' '+cb+' '+cl+')';
  128. setTimeout("window.location.href='main.html'",10000)
  129. }
  130. window.onload=loadimages;