Camping_RIDER: <div> bzw. <p> Elemente finden, die auf display="none" sind?

Beitrag lesen

Aloha ;)

Fünf Funktionen verteilt auf 223 Zeilen Code (ohne Einrückungen oder Zeilenabstände) - der reinste Alptraum! - Aber es läuft!

Mit Einrückungen wäre es sicher weniger Albtraum ;) Jedem so, wie er es will :D

Jetzt bleiben eigentlich nur noch zwei Fragen zu dem Thema, bei denen ich nicht so wirklich weiterkomme:

  1. Verzögerung der Funktionsausführung, solange Animation läuft

Bislang hatte ich es auf der Seite immer so gehandhabt, dass ich vor jede Funktion, die mit einer laufenden Animation kollidieren könnte, einfach eine Bedingung gesetzt habe im Sinne von:

element1.addEventListener("click",function(){

if((element2.style.animationPlayState=="running")
||(element3.style.animationPlayState=="running")){}
else{ /* ... */ }});


>   
> Das hat aber natürlich erstens den Nachteil, dass, wenn irgendwas läuft, eben beim Click auf das Element nichts passiert und man dann nochmal draufclicken muss, was irgendwie einen touch von "funktioniert nicht richtig" hat, und zweitens ist diese Art der Konfliktvermeidung wohl ziemlich unbrauchbar, wenn man keine statischen, in überschaubarer Menge vorliegenden, sondern wie ich hier in diesem Fall, unzählige dynamisch erstellte Elemente hat!  
  
Ja, das stimmt. Das sollte nicht so sein. Besser: die erneute Auslösung der Funktion, die auf den klick (oder was auch immer) hört, per window.setTimeout nochmal nachschieben. Der User sollte (je nachdem wie lange es dauert bis dann was passiert) aber auch direkt eine visuelle Rückmeldung bekommen, dass seine Eingabe registriert und nur noch nicht abgearbeitet wurde - z.B. durch einen unstörend aufpoppenden Hinweistext.  
  

> Ich dachte daran, vieleicht dem "boxContainer", der ansich keine Klassenbezeichnung hat, mit jedem Animationsstart einen `boxContainer.className="running"`{:.language-javascript} und mit jedem Animationsende einen `boxContainer.className="clear"`{:.language-javascript} mit auf den Weg zu geben, und dann so etwas wie eine while-Schleife zu installieren, also `while(boxContainer.className=="running"){}`{:.language-javascript} oder so, aber wie könnte ich das umsetzten? - Habe Angst davor, mit `while`{:.language-javascript} herumzuexperimentieren, nachdem ich doch zuletzt meinen Browser damit schachmatt gesetzt habe! ;)  
  
Davon würde ich (in dem Fall) auf jeden Fall auch die Finger lassen. Nimm die nativ gegebenen Möglichkeiten (setTimeout, setInterval). Alles andere würde heißen, die Webseite und den Browser mit ihrer eigenen Rechenfähigkeit bewusst zum erliegen zu bringen.  
  

> 2. Hüpfende Boxen in der Ablage  
>   
> Aber ich nehme an, da kann man nichts machen, abgesehen davon, jeder "Ablagebox" noch einen unsichtbaren Rahmen mitzugeben, den man dann mit CSS so animiert, dass er sich nach dem Ausblenden der "Ablagebox" langsam verkleinert... hmm...nochmehr Code! D:  
  
Hätte ich intuitiv jetzt auch so gemacht. Vorschlag zur Güte: Statt die Box auszublenden und nen leeren Ramen dafür einzublenden: Lass doch einfach die vorhandene Box zuerst kleiner werden und blende sie dann endgültig aus. Spart auf jeden Fall Code, wahrscheinlich kannst du da an den meisten Stellen vorhandene Funktionalitäten einfach ausbauen.  
  

> Tja mal sehen, aber falls du mir das mit der while-Schleife irgendwie idiotensicher verklickern könntest, wäre das der Wahnsinn! ;)  
  
Idiotensicher und Wahnsinn schließt sich aus.  
  
Grüße,  
  
RIDER  
  

-- 
Camping\_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller  
  
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[