DIV scrollen - Performance

[Sven Burkert]

Hallo,

ich habe in einem DIV (style=position:relative;width:100px;overflow:hidden) ein Bild (style=position:absolute;top:0;left:0). Diese Bild kann ich über zwei Pfeile nach links und rechts scrollen. Dabei ist die Animation (vor allem im Firefox) sehr ruckelig (im IE nicht!). Die CPU Last geht auf bis zu 100% hoch (meine CPU hat 2,8 GHz). Wenn ich im IE scrolle, zuckt die CPU-Auslastungskurve nicht einmal.

Die Funktion zum Scrollen rufe ich periodisch auf:

t = setInterval("scrollRight()", 10);

In der Funktion selbst setze ich die Style-Anweisung "left" auf einen anderen Wert (ich nutze die JavaScript-Bibliothek jQuery):

function scrollRight() {
 // aktuellen Wert ermitteln:
 left = parseInt(globalVarScrollerImages.css("left"));
 // Wert erhöhen, nur scrollen, wenn Bild nicht schon ganz links positioniert ist
 if (left + 4 < 0) {
  left += 4;
 } else {
  left = 0;
 }
 // Wert setzen
 globalVarScrollerImages.css("left", left);
}

Ist mein Ansatz falsch, ca. 100 mal pro Sekunde den left-Wert neu zu setzen? Wenn ich den Wert nur 10mal oder 20mal pro Sekunde ändere, stockt und ruckelt es im FF trotzdem. Gibt es hier eine andere Lösung? Ich habe mir die Animations-Funktion in jQuery angeschaut (custom: function(from, to, unit)), aber da blickt ich nicht durch.
Hat jemand Tipps, wieso der Firefox hier solche Probleme hat?

[Alexander (HH)]

Moin Moin!

Ist mein Ansatz falsch, ca. 100 mal pro Sekunde den left-Wert neu zu setzen?

Öm, Du weißt schon, dass TFTs das Bild in aller Regel nur 60 mal in der Sekunde neu aufbauen? Selbst meine CRTs habe ich auf 85 Hz eingebremst.

Warum murst Du selbst eine Scroll-Funktion hin, wenn es ein einfacher Scrollbalken auch täte?

Alexander

[Cyx23]

Hallo,

Dabei ist die Animation (vor allem im Firefox) sehr ruckelig (im IE nicht!).

Etwas Ruckeln ist normal. Beim Intervall würde ich 50 statt zehn verwenden,
vielleicht noch die Pixel pro Schritt etwas erhöhen.

Die CPU Last geht auf bis zu 100% hoch (meine CPU hat 2,8 GHz). Wenn ich im IE scrolle, zuckt die CPU-Auslastungskurve nicht einmal.

Habe gerade mal ein ähnliches Script getestet, mit langsamerer CPU und
Windows XP sowie aktuellem Firefox 2.x.

Die CPU Last liegt bei 0% mit gelegentlichen Spitzen um die 2%.

Könnte es sein, dass du Fehler im Script hast, z.B. setInterval mehrfach
aufrufst, ohne vorherige Intervalle zu löschen?

Grüsse aus Düsseldorf

Cyx23