Анимированный GIF не работает в FireFox после кэширования - PullRequest
10 голосов
/ 14 мая 2010

У меня есть анимированный GIF, который повторяется три раза. Я заметил в Firefox и Chrome (не проверял другие), что я могу просмотреть GIF один раз, а затем, если я перезагружаю страницу, кэшированный GIF вообще не анимируется.

Есть ли решение для этого? Есть ли что-то в анимированном GIF-файле, который я мог бы изменить, чтобы предотвратить это?

Ответы [ 5 ]

3 голосов
/ 28 мая 2010

Это очень уродливое решение, но вы можете использовать это, если вы называете изображение встроенным, не очень красивым, но оно работает!

<img src="filename.gif?rand=<?=rand(1,1000);?>" alt="" />

надеюсь, что поможет

1 голос
/ 30 января 2011

Решение Джейд О'Коннор работает, но, как уже говорилось, это уродливое решение. Потому что каждый раз, когда вы посещаете страницу, изображение загружается с сервера. Это приводит к проблемам с большими изображениями. Это также увеличивает время загрузки страницы, поэтому это плохо для медленных соединений.

Есть ли лучшее решение?

Я понял что-то вроде этого:

Я восстановил анимированный GIF в цикле "навсегда" режиме. В моем gif было 20 кадров, и каждый показывается в течение 150 мс. Так что один шаг цикла длится 3 секунды. Я также создал jpeg-версию последнего кадра анимации.

Когда страница загружается, я использовал метод window.setTimeout () для замены gif на jpeg через 3 секунды. Потому что я хотел, чтобы последний кадр остановился, когда первый этап цикла завершен. Но были проблемы со временем. Когда отображается последний кадр, анимация перезапускается, прежде чем я смог заменить gif на jpeg. Есть ли способ определить, завершена или перезапущена анимация?

1 голос
/ 14 мая 2010

Решение, которое я выбрал в этом случае, состояло в том, чтобы добавить переменную GET в конец графического имени, предотвращая повторную загрузку графики из кэша при обновлении страницы.

var myImg = new Image();
myImg.src = "image.gif?rnd=" + Math.random();
0 голосов
/ 14 мая 2010

В Firefox вы можете принудительно выполнить полную перезагрузку (перезагрузить кэш) с помощью Ctrl + Shift + R или Ctrl + F5 .

В Chrome , это Ctrl + F5 или Shift + F5 .

0 голосов
/ 14 мая 2010

Не могли бы вы указать нам GIF в вопросе? Это происходит со всеми GIF-файлами, которые вы используете? Все сделано с помощью одного приложения?

В любом случае, просто не кэшируйте и вуаля, решено. Но я думаю, вам следует использовать другое приложение , чтобы создать свой GIF и посмотреть, работает ли он правильно.

...