Alexander Gordt: Geht das nicht kürzer?

Hi Leute!

Ich habe ein Script, um einen Balken dynamisch aus und wieder einzufahren. Funzt wunderbar, doch ich würde gerne meinen Quelltext verkürzen.

Bisher geht das so:
.
.
function zeigen(name){
switch(name){
case "Feld1": document.Feld1.left = "63"; (weitere Befehle)
break;
case "Feld2": document.Feld2.left = "63"; (weitere Befehle)
break;
}
}
.
.
Ich möchte gerne diese Switchabfrage wegbekommen und statt dessen etwas derartiges haben:

function zeigen(name){
document.[name].left = "63";
}

-Oder so ähnlich. Abhängig vom Feld gibt es noch einige weitere Zeilen, die meine HTML-Seite auf über 350 Zeilen bringt. Deshalb suche ich eine Möglichkeit, das ganze zu verkürzen und damit übersichtlicher zu machen.

Viele Grüße,

Alexander

  1. »> .

    Ich möchte gerne diese Switchabfrage wegbekommen und statt dessen etwas derartiges haben:

    function zeigen(name){
    document.[name].left = "63";
    }

    und warum machst du es dann nicht so? LOL

    Cruz

    1. und warum machst du es dann nicht so? LOL

      weil es so nicht funktioniert!

      Ich habe das nur als Verdeutlichung hingeschrieben, um nochmal zu erklären, was ich letztendlich erreichen will.

      Alexander

  2. case "Feld2": document.Feld2.left = "63"; (weitere Befehle)

    Du kannst auch eval benutzen in der Art:

    obj = eval("document."+name);
    obj.left = "63";

    eval wertet sozusagen den String aus, was anscheinend aber auch manchmal automatisch gemacht wird. Ganz genau weiß ich das auch nicht, aber mit eval klappts wohl besser/öfter als 'String einfach so benutzen' wie Cruz das vorschlägt.

    Philipp

    1. Hi Philipp!

      Vielen Dank für den Tip!

      Jetzt funzt fast alles, wie ich mir das vorstelle. Wenn Du mir dabei helfen konntest hätte noch eine weitere Frage:

      Ich habe jetzt folgenedes Script:

      function rollout(name)
      {
      obj = eval("document.all."+name);
      for(i = 1;i < 110;i++)
      {
        k = -47 + i;
        obj.style.setAttribute('left',k,'false');
        for(l = 1;l < 75;l++)
        {}
      }
      }

      Hättest Du eine Idee, wie ich den IE dazu bekomme, daß das div-Tag, das dahinter steht auch langsam rausfährt und nicht aus dem NICHTS auftaucht? Im Netscape funzt das, doch der IE gibt keine Zwischenergebnisse raus.

      Wäre toll, wenn Dir dazu auch was einfällt. Wenn nicht trotzdem tausend Dank,

      Alexander

      1. function rollout(name)
        {

        »»  obj = eval("document.all."+name);
        »»  for(i = 1;i < 110;i++)
        »»  {
        »»   k = -47 + i;
        »»   obj.style.setAttribute('left',k,'false');
        »»   for(l = 1;l < 75;l++)
        »»   {}
        »»  }

        }

        Hättest Du eine Idee, wie ich den IE dazu bekomme, daß das div-Tag, das dahinter steht auch langsam rausfährt und nicht aus dem NICHTS auftaucht? Im Netscape funzt das, doch der IE gibt keine Zwischenergebnisse raus.

        Du solltest Zeitverzögerungen niemals mit leeren Warteschleifen schreiben.(Zumindest nicht mehr, seitdem Betriebssysteme Multitaskingfähig sind.)
        IE erkennt anscheinend sogar die leere for-Schleife und übergeht sie einfach.
        Prinzipiell brauchts Du sowas:

        var rolloutCount
        function rollout(name)
        {
          ...

        rolloutCount--;
          if (rolloutCount>0)
        {  window.setTimeout("rollout()",10000 }
          }

        aufrufen mit:

        rolloutCount=110;
        rollout(name);

        mit setTimeout startest Du die funktion nocheinmal nach einer festgelegten Zeitspanne. Die Zeit dazwischen kann der Computer für irgendwas anderes nutzen und muß keine leere Schleife abarbeiten.
        Wenns schneller gehen soll -> die 10000 runtersetzen, das sollen 1/10 oder 1/100 Sekunden sein, halt die Wartezeit, aber Ausprobieren klappt besser als Ausrechnen.

        In der Form, wie ich das da oben gemacht habe, ergibt sich aber auch ein neues Problem aus dem Bereich 'nebenläufige Prozesse':
        Wenn jetzt ein Element gerade bewegt wird während der User mit seiner Maus die Bewegung eines zweiten Elements veranlasst, geht das komplett schief, weil dieselbe Funktion und derselbe Zähler benutzt wird.
        zumindest theoretisch gibts 2 Lösungen:

        Billiglösung:  noch eine boolsche Variable benutzen, die festlegt, ob noch ein Layer bewegt wird, und so veranlassen, daß kein zweites Bewegen gestartet wird, solange das erste nicht beendet ist.
        Dürfte ganz gut aussehen, solange die eigentliche Bewegung schnell und damit schnell beendet ist.

        Lösung, die kompliziert ist:
        (So macht man sowas in Java) das ganze als Thread-Klasse definieren und für jede Bewegung eine neue Instanz bilden.
        Das geht in JS wohl nicht, Du könntest vielleicht ein Variablenfeld o.ä. definieren, für jede Bewegung einen Zähler und die Zähler-nummer mit im Aufruf von rollout übergeben, rollout müsste dann nur diesen Zähler runterzählen und in settimeout wieder sich selbst mit dem selben Zähler aufrufen.
        Der Aufruf wird dann aber noch kompliziert, weil du beim Start einer neuen Bewegung immer erst eine Zählernummer rausfinden müsstest, die noch nicht benutzt wird.
        (funktioniert aber auf jeden Fall irgendwie)

        Ist alles ein bisschen overkill, aber wenn man sowas schon macht, dann sollte es auch glatt laufen, sonst produziert man bloss eine weitere Seite der Art 'Viel Spielkram und kaum zu bedienen'.

        Naja, viel Erfolg, das ist hart, aber das schaffst du schon.

        Philipp

        1. Mir ist noch ne Lösung eingefallen, wohl die eleganteste:
          Du schreibst einfach eine Funktion, die immer alle 1/50 Sekunde aufgerufen wird, egal ob was bewegt wird, oder nicht. Wenn z.B alle divs immer von x-Pos:-50 bis  x-Pos:200 bewegt werden sollen, testet die Funktion ob alle divs entweder bei -50 oder bei 200 sin, und wenn nicht bewegt sie das entspr. div um ein paar Pixel in die Richtung die durch eine Variable speziell für das div festgelegt ist.

          so ähnlich:

          if (x>50 && x<200)
          { if obj.richtung = "raus" { x-=5;}
            if ...                    rein     x+=5
          }

          Um eine Bewegung zu starten mußt Du bloß den div um 1 in die richtige Richtung bewegen und die Richtungsvariable setzen.
          Philipp

          1. Hi Philipp!

            Ich habe mich eben mal mit dem setTimeout beschäftigt. Wenn ich hergehe und nur eines meiner 6 Felder mal mit dieser Funktio laufen lasse, dann tun sich einige Probleme auf:

            1.) Der Timeout dauert selbst bei 1 (statt 10000) zu lange, wodurch das scrollen zu langsam geht (habe auch versucht große Pixelsprünge zu machen - sieht komisch aus).

            2.) Wenn jemand schnell mit der Maus ins Feld rein und dann wieder raus fährt, dann öffnen sich, da der Rechner im Timeout Zeit für neue Aufgaben hat, neue Instanzen der Bewegung und das ganze endet in einem völligen Chaos aus Raus- und Reingefahre.

            Ist es da nicht besser die 3 Sekunden Rechnerleistung zu verschlingen und dafür ein glattes scrollen zu erreichen? Bei Deinem zweiten Vorschlag wird doch eigentlich einiges an Rechnerleistung verbraucht - immer nachschauen ob sich eines der Tags bewegt hat? - Wenn ich Dich richtig verstanden habe, liegt der "Fehler" vom IE daran, daß er die leere Schleife erkennt und damit ignoriert. Wenn ich in die Schleife aber einen "dummi-Befehl" einbaue, der eine Variable durchzählt, dann müßte das Problem doch behoben sein oder?

            Viele Grüße,

            Alexander Gordt

            1. Ist es da nicht besser die 3 Sekunden Rechnerleistung zu verschlingen und dafür ein glattes scrollen zu erreichen? Bei Deinem zweiten Vorschlag wird doch eigentlich einiges an Rechnerleistung verbraucht - immer nachschauen ob sich eines der Tags bewegt hat? - Wenn ich Dich richtig verstanden habe, liegt der "Fehler" vom IE daran, daß er die leere Schleife erkennt und damit ignoriert. Wenn ich in die Schleife aber einen "dummi-Befehl" einbaue, der eine Variable durchzählt, dann müßte das Problem doch behoben sein oder?

              ausprobieren! Wird aber immer unsauberer Code sein.
              Ob die nächste Browsergeneration vielleicht ne intelligentere 'Leerschleifenerkennung' hat, weiß keiner und auf schnelleren Rechnern wirds auch wesentlich schneller sein.
              Aber wo Du's sagst: Ich habe letztens 30 3*3-Gifs mit JS und
              setInterval() gleichzeitig nach nem Muster durch die Gegend geschoben und das sieht auch nur bei sehr ruhigen Gewegungen gut aus.

              Philipp