Inhalt

Einleitung Voraussetzungen Pop Up, Pop down Flatter, flatter Vorhang auf! Aufgabenstellung Vorbereitung Seite Bilder Anordnung Marilyn divs verschachteln positionieren relativ Vorhang zu Action! Hallo ... später Hallo ein Spalt Variable auf geht's! abschneiden schööön! weiteres heiteres Klappe zu!

---

Service

Kontakt & Feedback

CSS Anwendung

Vorhang auf!

Action!

auf geht's!

Noch immer öffnet sich unser Vorhang nur um 10 Pixel. Wir können nun unserer Funktion eine dritte Zeile geben, die folgendermassen aussieht:

 window.setTimeout("hallo(" + dist + ")",100) ;

Das braucht natürlich eine Erklärung. Die Anweisung window.setTimeout() weist den Browser an, im aktuellen Fenster nach einer bestimmten Zeit einen bestimmten Befehl auszuführen. In unserem Fall lautet der Befehl "hallo(" + dist + ")" und das bedeutet, wenn man die einzelnen Teile aneinanderreiht: hallo(10).

Das kennen wir: da wird unsere Vorhang-öffne-dich-Funktion aufgerufen, diesmal aber mit einem um 10 höheren Wert. Und wenn sie dann läuft, wird sie sich in ihrer dritten Zeile gleich wieder bestellen, mit einem wieder um 10 erhöhten Wert und so weiter.

Wir müssen also nur noch sicherstellen, dass das dann irgendwann mal aufhört. Wenn die Variable dist den Wert 350 erreicht hat, soll Schluss sein. Solche Dinge kann man in einer if-Abfrage regeln. Wir ergänzen also unsere neue Zeile entsprechend, und nun sieht unsere Funktion so aus:

 hallo(dist) {
   dist += 10 ;
   document.getElementById("vorhang").style.left = dist + "px" ;
   if(dist < 350) {
      window.setTimeout("hallo(" + dist + ")",100) ;
   } 
 }

Anmerkung noch: der Wert "100" bezeichnet Tausendstelssekunden. Der Aufruf unserer Funktion erfolgt also jeweils nach 100/1000 oder einer Zehntelssekunde.

ausprobieren!