Boworiyn: IE startet animiertes gif zu spät

Hallo zusammen.
Ich hab folgendes Problem. Ich hab eine ziemlich große Seite mit sehr langer Ladezeit (ist keine Seite im klassischen Sinne, sondern eine Applikation). Um die Ladezeit zu überbrücken möchte ich ein animiertes gif voranschicken (diese klassische stilisierte rotierende Uhr). Zuerst hab ich den einfachen Weg gewählt:

<body>  
<div id="div1"><img src="meineUhr.gif"></img></div>  
<div id="div2" style="display:none"> Hier ist der ganze Content</div>  
</body>  

Nach dem Laden wird div2 auf display=block gestellt und div1 mit removeChild rausgeschmießen.

Im FF funktioniert das Prima, nur der IE (V8) startet die Animation erst, wenn alles geladen ist (was natürlich nicht Sinn der Sache ist). Ich hab daraufhin versucht, sowohl div1 als auch div2 durch iframes zu ersetzen, hat den IE aber nicht beeindruckt. Hat jemand eine Idee, was man noch versuchen könnte?

Danke für eure Hilfe

Michael

  1. Eventuell schonmal mit einem onLoad im body versucht?

    Oder mit einem Script im Head wo die gif schon vorgeladen wird?

    1. Eventuell schonmal mit einem onLoad im body versucht?

      Oder mit einem Script im Head wo die gif schon vorgeladen wird?

      Hab ich, der IE ladet das gif auch ganz brav und zügig am Anfang und zeigt es auch an. Jedoch leider unanimiert. Die Animation startet er erst, wenn er alles geladen hat (wenn der feine Herr Browser Zeit dafür hat ;-) )

      1. Hallo,

        Die Animation startet er erst, wenn er alles geladen hat (wenn der feine Herr Browser Zeit dafür hat ;-) )

        das ist genau der Punkt. Man scheint in Redmond der Ansicht zu sein (die ich übrigens teile), dass animierte GIFs nur ein optisches Gimmick, ein Deko-Effekt sind. Daher werden diese Animationen nur bearbeitet, wenn der Browser sonst nichts zu tun hat.
        Im IE stoppt eine GIF-Animation z.B. auch, sobald man einen Link in der Seite anklickt - sogar dann, wenn der Link keine neue Seite lädt, sondern z.B. eine Javascript-Funktion ausführt oder der Server mit 204 No Content antwortet.

        So long,
         Martin

        --
        Mit einem freundlichen Wort und einer Waffe erreicht man mehr, als mit einem freundlichen Wort allein.
          (Al Capone, amerikanische Gangsterlegende)
        1. Hi

          das ist genau der Punkt. Man scheint in Redmond der Ansicht zu sein (die ich übrigens teile), dass animierte GIFs nur ein optisches Gimmick, ein Deko-Effekt sind. Daher werden diese Animationen nur bearbeitet, wenn der Browser sonst nichts zu tun hat.

          Da hast du (bzw Redmond) in den meisten Fällen wohl recht, animierte Simlys sind nicht wirklich das, was die Menschheit braucht. Aber gerade in diesem Fall, als Hinweis das noch geladen wird und etwas geschieht, ist die Animation schon sinnvoll (im Sinne von "Hab Geduld, ich lebe noch!")

          Im IE stoppt eine GIF-Animation z.B. auch, sobald man einen Link in der Seite anklickt - sogar dann, wenn der Link keine neue Seite lädt, sondern z.B. eine Javascript-Funktion ausführt oder der Server mit 204 No Content antwortet.

          Gibt es da überhaupt keine Chance?

          So long,
          Michael

          1. Om nah hoo pez nyeetz, Boworihyn!

            Gibt es da überhaupt keine Chance?

            {cursor: wait}?

            Matthias

            --
          2. Hi there,

            Gibt es da überhaupt keine Chance?

            Doch, zu der Lösung, die Apsel vorgeschlagen hat, wäre die Verwendung von CSS-Sprites, die Du mit JS animierst, möglich. Es ist ohnehin nie eine gute Idee, den Browser irgendwetwas, und sei es nur ein animiertes Gif, selbst entscheiden oder kontrollieren zu lassen. (Abgesehen natürlich von irgendwelchen zappelnden Smilies oder was weiss ich noch, da ist es einfach egal)...

            1. Hallo,

              Doch, zu der Lösung, die Apsel vorgeschlagen hat, wäre die Verwendung von CSS-Sprites, die Du mit JS animierst, möglich.

              Das sagt mir jetzt überhaupt nichts. Werde mich mal schlau machen.

              Es ist ohnehin nie eine gute Idee, den Browser irgendwetwas, und sei es nur ein animiertes Gif, selbst entscheiden oder kontrollieren zu lassen.

              Sag das nicht mir, sondern Redmond.

              Danke
              Michael

              1. 'ǝɯɐu$ ıɥ

                Doch, zu der Lösung, die Apsel vorgeschlagen hat, wäre die Verwendung von CSS-Sprites, die Du mit JS animierst, möglich.

                Das sagt mir jetzt überhaupt nichts. Werde mich mal schlau machen.

                http://www.drweb.de/magazin/css-sprites-quellensammlung/

                ssnɹƃ
                ʍopɐɥs

                --
                Confucius say, Man who stand on toilet is high on Pot.
            2. Hi,

              Doch, zu der Lösung, die Apsel vorgeschlagen hat, wäre die Verwendung von CSS-Sprites, die Du mit JS animierst, möglich.

              Hab das jetzt fix mal ausprobiert, wobei ich die Animation mit setInterval gestartet hab, das Problem ist aber immer noch dasselbe. Es wird erst animiert, wenn Zeit dafür da ist. (Diesmal auch beim FF).

              1. Hi there,

                Hab das jetzt fix mal ausprobiert, wobei ich die Animation mit setInterval gestartet hab, das Problem ist aber immer noch dasselbe. Es wird erst animiert, wenn Zeit dafür da ist. (Diesmal auch beim FF).

                Klingt nach Design-Fehler (Oder Dein Bild ist ein paar MB gross). Die Frage ist ja, wo Du das startest. Mit setInterval jedefalls bist Du schon auf dem richtigen Weg...;)

                1. Hi

                  (Oder Dein Bild ist ein paar MB gross).

                  Nö, hat nur 2KB.

                  Die Frage ist ja, wo Du das startest.

                  Anbei mal ein Testcode. Gestartet hab ich die Animation sowohl dort wo sie jetzt gestartet wird als auch an den Stellen "Nummer2", "Nummer3" und in meiner Verzweiflung auch als onload-event im body-tag.

                  Aber egal wo es gestartet wird, zuerst lädt der IE die anderen Files (ganz unten) und beginnt dann erst mit der Animation.

                    
                  <head>  
                  <title>test</title>  
                    
                  <script type="text/javascript">  
                  borders=new Array(-32,-64,-96,0);  
                    
                  function annimate() {  
                   var pos=borders.shift();  
                   borders.push(pos);  
                   document.getElementById("image").style.left=pos+"px";  
                  }  
                    
                  window.setInterval("annimate()",300);  
                  </script>  
                  </head>  
                  <body>  
                  <!--Nummer2-->  
                  <div style="height:32px; width:32px; position: relative; top:300px; left: 300px; overflow:hidden;">  
                  <img id="image" src="images/sprit.png" style="position:absolute; left:0px;"></img>  
                  </div>  
                  <!--Nummer3>-->  
                  <script type="text/javascript" src="sehrVieleUndGrosseJSFiles"</script> <!--Hier ist die Last-->  
                    
                  </body>  
                  </html>