Java & JavaScript


Home
Applets
Scripts
   Navigation:
 · Kontextmenü
 · Linkwechsler
   Dialogboxen:
 · Alert
 · Alert 2
 · Confirm
 · Prompt
   Animation:
 · Kreis
 · Kreis 2
 · Kreis 3
 · Drei Kreise
 · Spirale
 · Planetarium
 · Globus
   Grafik-Effekte:
 · Clipping
 · Clipping 2
 · Clipping 3
 · Alpha-Clipping
 · Fading
 · Wellenmuster
 · Wellenmuster 2
   Bildschirmschoner:
 · Proto
 · Marquee
 · Donut
 · Worm
 · Mondrian
 · Pacman
   Datum & Uhrzeit:
 · Countdown
 · Countup
 · Wochentag
 · Last Modified
   Fraktale:
 · Apfelmännchen
 · Apfelmännchen 2
 · Juliamenge
 · Juliamenge 2
 · C-Wert-Generator
   Mathematik:
 · Primzahlen
 · Primzahlen 2
   Verschiedenes:
 · Dynamic Popup
 · TextArea Counter
 · Warteschleife
 · Mausschreiber
Gäste
Kontakt

- JavaScript : Verschiedenes : Warteschleife -


Eine Fortschrittsanzeige als Warteschleife mit JavaScript.

Erfolgreich getestet mit Internet Explorer 5.5 und 6.0, Netscape Navigator 4.75, 6.1 - 6.22, 7.0 und 7.1, Mozilla 1.0, 1.21 und 1.4 sowie mit Opera 5.02, 5.11, 6.0, 6.01 und 7.01.

Diese Warteschleife ist aber noch ohne Ladefunktion.


Demo:  Hier


Der JavaScript-Quellcode :

<script language="javascript">
  nn4=(document.layers)?1:0;
  nn6=(document.getElementById&&!document.all)?1:0;
  op5=(document.all&&!document.styleSheets)?1:0;
  ie5=(document.getElementById&&!nn6&&!op5)?1:0;

  if(ie5||nn6||nn4||op5) {
    document.write("
        <style type='text/css'>div {position:absolute;left:-500;top:-500}</style>");

    //Rahmen erzeugen
    if(ie5||nn6||op5) document.write("<div id='P0'>"+
        "<table width='300' height='30' cellpadding='0' cellspacing='0'"+
        "style='border-width:1;border-style:solid;border-color:red'><tr><td>"+
        "<p align='center'>Geich geht's weiter ...</p></td></tr></table></div>");
    else document.write("<div id='P0'>"+
        "<table width='300' height='30' cellpadding='0' cellspacing='0' border='1'"+
        "style='border-width:1;border-style:solid;border-color:red'><tr><td>"+
        "<p align='center'>Geich geht's weiter ...</p></td></tr></table></div>");

    //Fortschritts-Felder erzeugen (Leerzeichen wg. NN 4x nicht vergessen)
    t="<table width='30' height='30' bgcolor='red' border='0'"+
        "cellpadding='0' cellspacing='0'><tr><td>&nbsp;</td></tr></table>";
    for(i=1;i<11;i++) document.write("<div id='P"+i+"'>"+t+"</div>");
  }

  n=-1;

  //Fortschritt anzeigen. Wenn fertig, zurück zur Startseite.
  function progressBar() {
    n++;
    if(ie5) {
      if(n!=0)
        document.getElementById("P"+n).style.left=document.body.clientWidth/2-180+30*n;
      else document.getElementById("P0").style.left=document.body.clientWidth/2-150;
      document.getElementById("P"+n).style.top=document.body.clientHeight/2;
    }
    else if(nn6) {
      if(n!=0) document.getElementById("P"+n).style.left=window.innerWidth/2-180+30*n;
      else document.getElementById("P0").style.left=window.innerWidth/2-150;
      document.getElementById("P"+n).style.top=window.innerHeight/2;
    }
    else if(nn4) {
      if(n!=0) document.layers[n].left=window.innerWidth/2-180+30*n;
      else document.layers[n].left=window.innerWidth/2-150;
      document.layers[n].top=window.innerHeight/2;
    }
    else if(op5) {
      if(n!=0) {
        if (/Opera( |\/)7/i.exec(navigator.userAgent)) {
          document.getElementById("P"+n).style.left=window.innerWidth/2-183+30*n;
          document.getElementById("P"+n).style.top=window.innerHeight/2-8;
        }
        else {
          document.getElementById("P"+n).style.left=window.innerWidth/2-180+30*n;
          document.getElementById("P"+n).style.top=window.innerHeight/2-5;
        }
      }
      else {
        document.getElementById("P0").style.left=window.innerWidth/2-150-3;
        document.getElementById("P0").style.top=window.innerHeight/2-8;
      }
    }
    setTimeout("
      if(n<10) progressBar();else location.replace('Warteschleife.html')",1000);
  }
</script>

Und in den body-tag kommt onload="progressBar()".


Download  Warteschleife.zip (ca. 1,5 kb)




© 2001-2004 Albert Kluge - Alle Rechte vorbehalten
Impressum | Datenschutz | Nutzung | eMail