André Derron: Bild ruckelt beim schieben

Hallo zusammen
Mit dem einfachen Code unten schiebe ich ein Bild-Banner aus dem
Fenster.
Frage:
Was kann ich machen, dass des Bild nicht ruckelt.
Kann man an dem Code etwas verbessern, braucht es
einen komplet anderen Ansatz?

Besten Dank im Voraus
André

  
    bild.style.left = bildX + "px";  
    bildX += 2;  
  
    if ( bildX < bildEnd ) {  
        timerID = setTimeout("setWanderBild()",5);  
    } else {  
        window.clearTimeout(timerID);  
    }  

  1. Kann man an dem Code etwas verbessern, braucht es einen komplet anderen Ansatz?

    der ansatz ist richtig, nur zehrt es etwas an der performance von modernen javascript-engines, wenn du 200x pro sekunde ein bild verschiebst

    1. Hi,

      der ansatz ist richtig, nur zehrt es etwas an der performance von modernen javascript-engines, wenn du 200x pro sekunde ein bild verschiebst

      ... was effektiv in den meisten Browsern nicht mal passieren wird. Eine Zeitspanne unter 20-50 Millisekunden wird häufig nicht erreicht.

      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. OK, ok..
        Habs befriffen, besten Dank.
        Manchmal sollte man einfach mal zurücklehnen und nachdenken.
        Besten Dank an alle

  2. Hallo,

    Was kann ich machen, dass des Bild nicht ruckelt.

    Aus dem Film ist bekannt, dass mindestens 25 Bilder pro Sekunde benötigt werden, um eine fliessende Bewegung wahrzunehmen.

    Das bedeutet natürlich, dass der Browser fähig ist, einen Teil des Sichtfensters in 40 ms (= 1000 / 25) zu verändern.

    Das wird ihm nicht gelingen, wenn du ihn alle 5 ms mit if- Abfragen und neuen Timeouts beschäftigst. Setze die Timeout- Zeit erstmal auf 40 ms, notfalls noch etwas höher.

    Wenn der Browser noch weitere Aufgaben zu erfüllen hat (z.B. animierte Grafiken zeigen oder andere Javascript-Funktionen durchlaufen) wird ihm das nur schwer gelingen.

    window.clearTimeout(timerID);

      
    Was soll diese Zeile? Du hast vor 5 ms einen Timeout gesetzt und nun fällt dir ein, du musst ihn zurückpfeifen? Dann setze ihn doch einfach nicht mehr neu. Mit Beschäftigungstherapie machst du deinen Browser bestimmt nicht schneller.  
      
    Kalle
    
    1. Aus dem Film ist bekannt, dass mindestens 25 Bilder pro Sekunde benötigt werden, um eine fliessende Bewegung wahrzunehmen.

      das ist ein bekannter irrglaube - je nach art der bewegung sind mehr oder weniger einzelbilder notwendig

      im übrigen hält sich auch das gerücht, dass ein mensch garnicht mehr als 25 einzelbilder pro sekunden wahrnehmen kann - das ist natürlich auch blödsinn

      idr sind aber 20 bis 30 frame für eine augenscheinlich flüssige bewegung ausreichend