Hoe animeer ik GIF’s in HTML-document?

Ik heb de volgende <img>-tag in een statisch HTML-document.

<img src="foo.gif" alt="This is an animated gif image, but it does not move"/>

Nadat ik het kenmerk srcheb ingesteld om te verwijzen naar een .gif-bestand (dwz foo.gif), verschijnt de GIF als een statische (of niet-bewegend) beeld. Hoe kan ik de GIF animeren?


Antwoord 1, autoriteit 100%

Standaard speelt de browser altijd geanimeerde gifs af, en je kunt dat gedrag niet veranderen. Als de gif-afbeelding niet animeert, kunnen er 2 manieren zijn om te kijken: iets mis met de browser, iets mis met de afbeelding. Om vervolgens de eerste variant uit te sluiten, vinkt u de vertrouwde afbeelding aan in uw browser (voer het fragment hieronder uit, deze gif is zeker geanimeerd en werkt in alle browsers).

Je code ziet er goed uit.
Kun je controleren of dit fragment voor jou geanimeerd is?
Zo JA, dan is er iets mis met je gif, als NEEer iets mis is met je browser.

<img src="https://i.stack.imgur.com/SBv4T.gif" alt="this slowpoke moves"  width="250" />

Antwoord 2, autoriteit 8%

Eens met het antwoord van Yuri Tkachenko.

Ik wil je hierop wijzen.

Het is een vrij specifiek scenario. MAAR het gebeurt.

Als je een gif kopieert voordat het volledig is geladen op een site zoals Google Afbeeldingen. het geeft alleen het voorbeeldafbeeldingsadres van die gif. Wat duidelijk geen gif is.

Zorg er dus voor dat het eindigt met de extensie .gif


Antwoord 3, autoriteit 5%

probeer

<img src="https://cdn.glitch.com/0e4d1ff3-5897-47c5-9711-d026c01539b8%2Fbddfd6e4434f42662b009295c9bab86e.gif?v=1573157191712" alt="this slowpoke moves"  width="250" alt="404 image"/>

Other episodes