Bild mit jQuery.ajax aktualisieren -> Bild flackert in Chrome

[Stefan-S]

Ich aktualisiere bei meiner Seite eine Liste in regelmäßigen Abständen, um diese immer auf dem neusten Stand zu halten. Diese Liste enthält Bilder. Jedes mal wenn die Liste neu geladen wird, flackern die Bilder kurz auf (sprich sie sind kurz weg und dann wieder da). Dieses Problem tritt aber zum Beispiel nicht beim Firefox auf, dafür aber im Chrome (gilt für die Desktop und mobilen Versionen der Browser).
Wie kann ich dieses Flackern verhindern? Schon einmal danke für jede Hilfe :-)

Mein Code sieht wie folgt aus:

Auf der Hauptseite steht ein Refresh Script + die Liste

        <script >
              $(document).ready(function() {
                  loadList();
                  setInterval("loadList();", 2000);
              });
        </script>

<ul id="liste" data-role="listview" data-theme="c" data-split-icon="delete">
</ul>

Die Funktion loadList() bekommt ein Html Fragment vom Server und ersetzt damit den Inhalt der Liste.

function loadList(){
    jQuery.ajax({
        type : "GET",
        url : "/loadList,
        success : function(response) {
            $("#liste").html(response);
            $("#liste").listview("refresh");
        },
    });
}

Das Fragment, welches vom Server geliefert wird sieht so aus (je nach Größe der Liste eben mehrere <li>):

<li>
   <a href="#"><img src="/icons/main.png" /> <h3>Listenelement</h3>
   </a>
</li>

 

[Tronjer]

Nur im Chrome oder auch im Safari?

Ich kenne dieses Flackern bei CSS-Animationen. Dagegen hilft meist ein:

-webkit-transform-style: preserve-3d;

auf dem entsprechenden Element. Falls es das nicht tut, einfach mal googeln.

 

[Stefan-S]

Danke, kann es zwar gerade nicht testen, aber vielleicht hilft es ja.

Google spuckt leider nichts brauchbares aus. Meist versuchen die Leute das mit Preloaden es Bildes zu lösen, aber das hilft mir nicht viel, wenn ich die komplette Liste bei einem Aufruf bekomme. Die zu preloaden bringt nämlich nix, oder ich war zu doof dazu ^^