JavaScript "BlindDown/Up" Sperre für Buttons

[HTMLTester]

Hallo,

ich arbeite derzeit etwas mit Javascript habe aber leider so gut wie gar keine Ahnung davon. Leider kann ich euch keinen Quelltext oder Seitenlayout geben, ich versuche aber das Problem so genau wie möglich zum Umschreiben.

Also: Ich habe mehrere Leisten untereinander angelegt (height:15px}, welche auf der Rechten Seite einen Plus Button besitzen (plus.gif). Sobald man da draufklickt, fährt darunter ein anderer DivTag auf und die anderen Balken werden nach unten geschoben. Dies habe ich mit „.BlindDown“ und „BlindUp“ in javascript gelöst. Außerdem verändert sich die Plus Grafik in eine Minus Grafik (minus.gif). Auch hier habe ich javascript verwendet „getElementById“. Und wenn man dann auf das Minus klickt wird es wieder geschlossen und aus dem Minus wird wieder ein Plus.

Soweit so gut den eigentlich sieht es auch richtig Prima aus und genauso wie ich es mit vorgestellt hatte. Leider gab es den unschönen Effekt das wenn man draufklickt WÄREND der script noch läuft, das sich „BlindDown“ und „BlindUp“ in die Quere kamen und das gesamte Layout zerstörten. Hierzu habe ich einen „{queue:{scope:'myscope', limit: 1}}“ gesetzt, damit immer nur ein script mit einmal laufen kann (dadurch kann man auch nicht mehrer Leisten mit einmal öffnen… leider). Somit war auch das Problem gelöst.

Doch wenn man es jetzt macht kommen sich die scripte zwar nicht in die Quere aber die Buttons ändern sich noch. Soll heißen: Ich Klicke auf Plus, DivTag öffnet sich und während das geschieht klicke ich nochmals auf das neu erschiene Minus und schon ist der DivTag zwar geöffnet aber oben ist noch ein „Plus“ zu sehen. Wenn man jetzt da drauf klickt passiert entweder gar nix, oder es wird wieder geöffnet (obwohl es schon offen ist).

Meine Frage also: Gibt es einen kleinen Skript welches „getElementById“ sperrt während ein „Blinddown“ bzw. ein „BlindUp“! noch läuft? Noch bessere wäre es wenn während „BlindDown/BlindUp“ noch läuft das Plus/Minus Zeichen kurzzeitig durch eine kleine .gif Grafik ersetz wird (eine Sanduhr oder so was).
Ein Timer ist an dieser Stelle nicht angebracht. Da jede neue Leiste unterschiedlich viel Inhalt haben wird.

Außerdem würde ich gerne wissen ob man den „{queue:{scope:'myscope', limit: 1}}“ so definieren das es nur auf diese eine Leiste zutrifft . So das man mehre Leisten mit einmal öffnen kann und OHNE das da die oben beschriebene Layout Zerstörung stattfindet.

Ich hoffe das war nicht zu ausführlich und Ihr könnt euch halbwegs vorstellen was ich machen will. Sorry auch das ich das so schlecht umschreibe aber mit Javascript habe ich leider fast gar keine Ahnung.

Ich danke für jede Hilfe.

 

[Frank]

da du kein quelltext posten konntest, weiss ich natürlich nicht genau wie ich dein problem lösen könnte.

Ich gehe aber generell davon aus, dass du viel zu kompliziert arbeitest!!!

ich habe mich mal an ein beispiel gewagt und dir etwas gecodet.
:arrow: http://www.ts-onlyfree.de/test/drop.html

Wenn ich deinene Text richtig verstanden habe, hast du soetwas in der art vor.
Wenn du dir mal den quelltext anschaust, wirst du sehen, dass sich javascript in grenzen hält.

Ich hoffe das hilft dir weiter

 

[HTMLTester]

Danke, vielen Dank!
Ich werde mit deinem Code ein wenig herumexperimentieren und mal sehen was sich machen lässt. Das Prinzip was du gecodet hast ist genau das was ich brauche nur das halt der BlindDown/Up Effekt da noch rein muss. Den Code dazu:

Effect.BlindUp = function(element) {
  element = $(element);
  element.makeClipping();
  return new Effect.Scale(element, 0,
    Object.extend({ scaleContent: false, 
      scaleX: false, 
      restoreAfterFinish: true,
      afterFinishInternal: function(effect) {
        effect.element.hide();
        effect.element.undoClipping();
      } 
    }, arguments[1] || {})
  );
}

Effect.BlindDown = function(element) {
  element = $(element);
  var elementDimensions = element.getDimensions();
  return new Effect.Scale(element, 100, Object.extend({ 
    scaleContent: false, 
    scaleX: false,
    scaleFrom: 0,
    scaleMode: {originalHeight: elementDimensions.height, originalWidth: elementDimensions.width},
    restoreAfterFinish: true,
    afterSetup: function(effect) {
      effect.element.makeClipping();
      effect.element.setStyle({height: '0px'});
      effect.element.show(); 
    },  
    afterFinishInternal: function(effect) {
      effect.element.undoClipping();
    }
  }, arguments[1] || {}));
}

(Nicht selber geschrieben)

Und während diesen Effektes tritt halt das Problem auf.
Ob man das an dieser Stelle nun wirklich schön findet lasse ich hier mal außen vor…

Danke für die Hilfe!

Edit: Ich habe mir überlegt das man eventuell einfach einen kleinen script einbaut welcher die beiden Ereignisse hintereinander auslöst: Also erst wenn „BlindDown/Up“ komplett beendet wurde wechselt der Button von Plus in Minus oder umgekehrt. Kann mir hierbei jemand einen Tipp geben wie man so was macht?