alert() verhindert korrektes Rendern von HTML

[ripmav]

Hallo,

mir ist eben etwas seltsames im Internet Explorer 8 aufgefallen:

document.getElementById('id').style.backgroundPosition = NeuerWert;  
alert('Test');

Der Code führt normalerweise dazu, dass erst die Position des Hintergrundbilds des angegebenen Elements geändert wird und dann die Alertbox angezeigt wird.

Aber manchmal (selten) wird erst die Alertbox angezeigt und erst nach dem Schließen der Alertbox wird die Position des Hintergrundbilds geändert.

In anderen Browsern ist es mir noch nicht aufgefallen.
Gibt es eine Möglichkeit, dem Browser mitzuteilen, dass er erst das HTML fertig rendern soll, bevor er die Alertbox anzeigt?
Oder kann man dieses Problem irgendwie anders umgehen?

MfG

[Georg]

Hallo,

Oder kann man dieses Problem irgendwie anders umgehen?

Script am Ende der Seite ausführen.

MfG

[ripmav]

Hallo,
danke für die Antwort!

aber ich führe das Script erst aus, wenn jemand auf einen Button klickt.

[molily]

document.getElementById('id').style.backgroundPosition = NeuerWert;

alert('Test');

  
Komisch, das müsste eigentlich direkt einen [Repaint](http://www.phpied.com/rendering-repaint-reflowrelayout-restyle/) auslösen, sodass der Browser die Seite mit den geänderten Styles neu zeichnet.  
Man kann Reflow aber auch mit dem Auslesen von Eigenschaften wie offsetWidth erzwingen - ob das in IE8 geht, müsstest du prüfen.  
  

> Oder kann man dieses Problem irgendwie anders umgehen?  
  
Vielleicht mit  
setTimeout(function () { alert('Test'); }, 1);  
Also alert mit einer minimalen Verzögerung aufrufen.  
Damit wird die aktuelle Funktionsausführung normal beendet, aber eine neue Funktion in die Event-Loop gehängt, die losgelöst danach ausgeführt wird.  
  
Mathias

[Gunnar Bittersmann]

@@molily:

nuqneH

Vielleicht mit
setTimeout(function () { alert('Test'); }, 1);
Also alert mit einer minimalen Verzögerung aufrufen.

Evtl. reicht auch 0 als Parameter. Und den setTimeout-Aufruf kann man vor anderen Browsern verstecken:

/*@cc_on setTimeout(function () { @*/  
alert('Test');  
/*@cc_on }, 0); @*/  

(cf. http://bittersmann.de/articles/label-inside/#autofocus)

Qapla'