Marvin: Layer bewegen

Hallo erstmal ich hab da ma ne frage:
bei der Function die ich  geschrieben hab macht der das Timeout nicht richtig und ruft es direkt 2mal auf und verschiebt denn Layer direkt auf den endpunkt und nicht erst auf den einen Punkt und wartet dann und dann auf den Endpunkt!

Erbitte Hilfe!!
Hier der Quellcode:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript">

var Punkte = new Array();

Punkte[0] = new Array;
Punkte[0]["x"] = 450;
Punkte[0]["y"] = 450;

Punkte[1] = new Array;
Punkte[1]["x"] = 240;
Punkte[1]["y"] = 240;

Punkte[2] = new Array;
Punkte[2]["x"] = 130;
Punkte[2]["y"] = 130;

function move_oefter(){
 var firstRun = "false";
 for(var i=0; i<Punkte.length; i++) {
  if(firstRun == "true"){
   // alert("setTimeout wird gestartet")
   document.getElementById("debug").value = document.getElementById("debug").value + "Warte 2 sec...\n"
      window.setTimeout('Move("layer1", ' + Punkte[i]["x"] + ', ' + Punkte[i]["y"] + ')','2000');
  }
  else {
   document.getElementById("debug").value = document.getElementById("debug").value + "Sofort...\n"
   Move("layer1", Punkte[i]["x"], Punkte[i]["y"]);
   firstRun = "true";
  }
 }
}

function Move(element_name, x, y) {
 var obj;
 if (document.all) {
  eval('obj = document.all.' + element_name);
 }
 else {
  obj = document.getElementById(element_name);
 }

document.getElementById("debug").value = document.getElementById("debug").value + "  Left: " + obj.style.left + ", Right: " + obj.style.top + "\n"
  obj.style.left = x + 'px';
  obj.style.top = y + 'px';
 return true;
}

</script>
</head>
<body>
<div id="layer1" name="layer1" style="position:absolute; left:10px; top:10px;">
dddd</div>

<p>&nbsp;</p>
<p>&nbsp;</p>
<p><a href="#" onClick="move_oefter();">bewege</a></p>
<p>
  <textarea name="debug" cols="40" rows="6" id="debug"></textarea>
</p>
</body>
</html>

Vielen dank schon mal im Vorraus!!!

  1. Hi,

    bei der Function die ich  geschrieben hab macht der das Timeout nicht richtig und ruft es direkt 2mal auf und verschiebt denn Layer direkt auf den endpunkt und nicht erst auf den einen Punkt und wartet dann und dann auf den Endpunkt!

    Du setzt in einer Schleife - welche wenige Millisekunden dauert - eine Anzahl Timeouts, die alle 2 Sekunden (wieso aber bitteschön als String?!) später ausgeführt werden - ebenfalls im Abstand von Millisekunden.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi,

      »»

      Du setzt in einer Schleife - welche wenige Millisekunden dauert - eine Anzahl Timeouts, die alle 2 Sekunden (wieso aber bitteschön als String?!) später ausgeführt werden - ebenfalls im Abstand von Millisekunden.

      thx^^

      Mörv

  2. Hi,

    Du bringst da einiges durcheinander. Schreibe einen Funktion, die die Position hochsetzt und anschliessend das Div positioniert. Diese ruft sich mit einem timeout selber wieder auf.
    Eine for-Schleife bei sichtbaren Ablaeufen ist Quark.

    Gruesse, Joachim

    --
    Am Ende wird alles gut.
  3. Hier der Quellcode:

    Dazu gibt es einiges zu sagen.

    <script language="javascript">

    Hier fehlt das type Attribut und das language Attribut ist unerwünscht.

    var Punkte = new Array();

    Punkte[0] = new Array;
    Punkte[0]["x"] = 450;
    Punkte[0]["y"] = 450;

    Das ist kein Array, sondern ein Objekt, du solltest es auch so verwenden:
    Punkte[0] = new Object;
    Punkte[0].x = 450;
    Punkte[0].y = 450;

    Punkte[1] = new Array;
    Punkte[1]["x"] = 240;
    Punkte[1]["y"] = 240;

    dito.

    function move_oefter(){
    var firstRun = "false";

    In JS gibt es false und true als Schlüßelwörter, es besteht also keine Notwendigkeit diese als String zu benutzen.

    var firstRun = false;

    for(var i=0; i<Punkte.length; i++) {
      if(firstRun == "true"){

    if(firstRun == true){

    // alert("setTimeout wird gestartet")
       document.getElementById("debug").value = document.getElementById("debug").value + "Warte 2 sec...\n"

    window.setTimeout('Move("layer1", ' + Punkte[i]["x"] + ', ' + Punkte[i]["y"] + ')','2000');

    Deine Parameter sehen seltsam aus. Lass dir doch mal mit einem alert ausgeben was da raus kommt. Als 2. Parameter wird eine Zahl in Millisekunden erwartet kein String.

    }
      else {
       Move("layer1", Punkte[i]["x"], Punkte[i]["y"]);
       firstRun = "true";

    firstRun = true;

    }
    }
    }

    function Move(element_name, x, y) {
    var obj;
    if (document.all) {
      eval('obj = document.all.' + element_name);

    eval ist evil!
    u.a. macht es dein Skript langsamer und es erschwert das debuggen.

    Und es ist einfach unnötig:
    obj = document.all[element_name];

    Das deine Schleife falsch ist wurde dir ja ausch schon gezeigt.

    Hier mal ein Möglichkeit wie das was du willst klappen könnte:

    <script type="text/javascript">
    function Point(x, y)
    {
        this.x = x;
        this.y = y;
    }
    var Punkte = new Array();

    Punkte[0] = new Point(450, 450);
    Punkte[1] = new Point(240, 240);
    Punkte[2] = new Point(130, 130);

    function move_oefter(nr)
    {
     if(!nr) nr = 0;
     Move("layer1", Punkte[nr].x, Punkte[nr].y);
     if(nr < Point.length) window.setTimeout( 'move_oefter('+ ++nr + ')', 2000);
    }

    function Move(element_name, x, y) {
        var obj;
        if (document.all) obj = document.all[element_name];
        else  obj = document.getElementById(element_name);
        obj.style.left = x + 'px';
        obj.style.top = y + 'px';
        return true;
    }
    </script>

    Struppi.

    1. Hallo,

      Punkte[0] = new Object;

      Huch, das ist erlaubt? Wenn ich Kapitel 11.2 von ECMAScript richtig verstehe, sind auf jeden Fall die Klammern »()« nötig, selbst wenn der Konstruktorfunktion keine Argumente übergeben werden.
      Es wundert mich, dass Firefox selbst im Strict-Modus (javascript.options.strict) keine Warnung anzeigt. War das mal erlaubt in Netscape-Javascript?

      Mathias

      1. Punkte[0] = new Object;

        Huch, das ist erlaubt? Wenn ich Kapitel 11.2 von ECMAScript richtig verstehe, sind auf jeden Fall die Klammern »()« nötig, selbst wenn der Konstruktorfunktion keine Argumente übergeben werden.
        Es wundert mich, dass Firefox selbst im Strict-Modus (javascript.options.strict) keine Warnung anzeigt. War das mal erlaubt in Netscape-Javascript?

        http://groups.google.de/groups?hl=de&lr=&ie=UTF-8&c2coff=1&threadm=323qloF3hsnlrU1%40individual.net&rnum=5&prev=/groups%3Fq%3Dnew%2BDietmar%26hl%3Dde%26lr%3D%26ie%3DUTF-8%26group%3Dde.comp.lang.javascript%26c2coff%3D1%26sa%3DG%26scoring%3Dd

        (ich krieg den Link nicht hin)

        Diese Dikussion setze sich (am Ende) mit dem Problem auseinander, da mein Uralt browser ziemlich schnell abtürzt, wenn ich diese google Seiten verwende hab ich mir das jetzt nicht genau durchgelesen, aber vielleicht stecken da noch ein paar Infos drin.

        Struppi.

        1. Hi,

          http://groups.google.de/groups?hl=de&lr=&ie=UTF-8&c2coff=1&threadm=323qloF3hsnlrU1%40individual.net&rnum=5&prev=/groups%3Fq%3Dnew%2BDietmar%26hl%3Dde%26lr%3D%26ie%3DUTF-8%26group%3Dde.comp.lang.javascript%26c2coff%3D1%26sa%3DG%26scoring%3Dd
          (ich krieg den Link nicht hin)

          ich schon!

          Cheatah ;-)

          --
          X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
          X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
          X-Will-Answer-Email: No
          X-Please-Search-Archive-First: Absolutely Yes
        2. Hallo,

          Punkte[0] = new Object;

          Huch, das ist erlaubt? (...)

          http://groups.google.de/groups?threadm=323qloF3hsnlrU1%40individual.net&frame=on

          Danke, aber daraus werde ich nicht wirklich schlauer. Georg Maaß und Co. fachsimpeln gerne einmal auf eine Weise, der ich keine Erkenntnisse abgewinnen kann.

          Offenbar hatte ich 11.2 falsch verstanden, weil dort eine NewExpression auch »new NewExpression« sein kann, was dann »new MemberExpression« bedeuten kann, was wiederum »new PrimaryExpression« bedeuten kann, was »new Identifer« bedeuten kann. Somit müsste »var objekt = new Object« und ähnliches zulässig sein (siehe auch 15.2.2.1).

          Morgen suche ich noch einmal weiter.

          Mathias