molily: Allgemeiner "DIV-Slide" funktioniert nicht ganz...

Beitrag lesen

Hallo,

Denn wenn ein DIV zum "sliden" gebracht wird, während ein anderer gerade noch am "sliden" ist, dann wird das "sliden" beim letzteren (also dem der schon im slide war) einfach unterbrochen, d.h. er wird nicht zu Ende geöffnet oder geschlossen.

Das ist ganz klar.

Rekapitulieren wir mal, was du tust:

function oSlide5(pObjekt)

Die Konstruktor-Funktion

this.DoSlide = function fSlide()

Du fügst der Instanz eine Methode hinzu

function fSlideAufZu(pObj)

Du definierst eine nur in dieser Methode gültige Funktion, die in der lokalen Variable fSlideAufZu gespeichert wird. Sie bekommt das Elementobjekt übergeben.

fSlideAufZuTimer = function()
   {
    fSlideAufZu(pObj);
   }

Hier definierst du eine GLOBALE Funktion am window-Objekt und überschreibst gegenbenenfalls eine gleichnamige, vorher gesetzte Funktion.
Rufst du den Konstruktor mehrmals auf, steht in fSlideAufZuTimer nur eine Funktion. Diese schließt die Variable pObj ein, und zwar mit dem Wert des letzten Aufrufs der Kontruktorfunktion.

Wenn du diese globale Funktion nun immer wieder ausführst:

pObj.Slide = window.setTimeout
                                ("fSlideAufZuTimer()", 50);

Dann wird immer das zuletzt gesetzte pObj behandelt, was solange gut geht, bis es nicht eine weitere Instanz gibt, die abwechselnd window.fSlideAufZuTimer wieder überschreibt.

Das ganze kannst du viel einfacher machen. Du willst in einer Funktion, die du mit setTimeout aufrufst, eine Variable zur Verfügung haben.
1. Du brauchst ihr dazu die Variable nicht übergeben, sie ist in ihr durch die Verschachtelung bereits verfügbar,
2. Du brauchst die Funktion auch nicht global speichern, du kannst setTimeout auch direkt eine Funktionsreferenz übergeben. Die Funktion wird dann allerdings im Kontext von window ausgeführt, sodass "this" nicht auf das Instanzobjekt zeigt. Über Umwege kann man es aber auch darin verfügbar machen.

function Konstruktor (elem) {  
  function step () {  
    // hier ist elem verfügbar  
    window.setTimeout(step, 50);  
  }  
  this.animate = function () {  
    step();  
  };  
}

Das Instanzobjekt verfügbar machen:

function Konstruktor (elem) {  
  var instanz = this;  
  function step () {  
    // hier ist elem und instanz verfügbar, sodass du daran irgendwelche Flags speichern kannst, je nach Bedarf  
  }  
  ...  
}

Vergleiche diesen Artikel:
http://aktuell.de.selfhtml.org/artikel/javascript/organisation/#methoden-eigener-objekte-und-kontext

Mathias