Animierte Gifs im IE

Datum: 4. Mai 2012
Autor*in: Bastian Schwarz


Gerade hat mich der IE mal wieder erstaunt (im negativen Sinne). Bei der IBE-Suche der AWK wird zur Überbrückung der Ladezeit eine Ladeanimation eingeblendet. Diese Animation wird mit einem animierten Gif dargestellt. Allerdings hat das Gif im Internet Explorer die Animation nicht ausgeführt.

Nach ein wenig Recherche bin ich auf einen Bug im IE gestoßen der die Animation von den Gifs nicht ausführen lässt wenn beim Hinzufügen des Objektes zum DOM das Objekt nicht sichtbar ist.

Der Workaround hierzu ist ein wenig tricky funktioniert aber einwandfrei. Ich habe eine einfach Funktion geschrieben die das src Attribut des Bildes nach einem kurzen Timeout erneut setzt. Das gleiche würde natürlich auch mit einem Div gehen, der die Grafik als background-image enthält.

function runAnimatedGif(animationImage, timeout) {
 if (animationImage.length === 0) return;
 timeout = timeout || 20;

  setTimeout(function() {
    animationImage.attr('src', animationImage.attr('src'));
  }, timeout);
}

Dieser Artikel wurde verschlagwortet unter:


Kommentare

Selber kommentieren:






Weitere Beiträge zum Thema Technologie


Einschränkung für Video AutoPlay ab Chrome 66

Autor*in: Stefan Oswald


Technologie // User Experience & Design


Seit der Verteilung von Chrome Version 66 tritt das Problem auf, dass Videos plötzlich nicht mehr von alleine starten, obwohl Autoplay vorgesehen und auch richtig konfiguriert ist. Besonders unpraktisch ist das für Bewegtbilder-Keyvisuals. Die Debug-Konsole liefert dabei folgenden Hinweis: Uncaught (in promise) DOMException: play() failed because the user didn’t interact with the document first. https://goo.gl/xX8pDD …


Beitrag lesen
07
MAI
18

Weitere Neuigkeiten von der JAX 2015

Autor*in:


Technologie


Bevor es zu spät ist und alle Neuigkeiten und Trends von der JAX 2015 in den Tiefen meiner Erinnerungen verschwinden, möchte ich die Gelegenheit nutzen und Euch eine Fortsetzung zu meinem ersten Bericht von der diesjährigen JAX liefern. API-Design mit Java 8 Lambdas (Angelika Langer) Hier gab es eine kurze Einführung zu Lambda-Ausdrücken aus Java …


Beitrag lesen
30
JUL
15

Apple Touch Icons nutzen

Autor*in: Bastian Schwarz


Projekte // Technologie // User Experience & Design


Ich habe mal ein wenig recherchiert und möchte hier das Ergebnis mitteilen. Die Apple Touch Icons können generell benutzt werden um Apps oder Webseiten auf z.B. den Startbildschirm zu pinnen. Ist bei der Webseite dann ein solches Icon hinterlegt wird das „Lesezeichen“ mit ihm hinterlegt und man erhält so einen schönen Wiedererkennungswert. Generell sollten die …


Beitrag lesen
17
OKT
12

The Vanilla Javascript Repository

Autor*in: Benjamin Hofmann


Technologie   //   User Experience & Design


Und gleich noch ein Linktipp für all diejenigen, die wie ich, nur ungern jQuery einsetzen und ihre Seiten dadurch aufblähen oder verlangsamen. Unter Vanilla List gibt es eine optisch sehr ansprechende Sammlung von Skripten, die auf Vanilla JS aufbauen und viele unserer Anwendungsfälle abdecken können. Sehr schön ist auch die direkte Anzeige davon, ob eine …


Beitrag lesen
23
SEP
16