Первый раз, когда я просматриваю страницу с анимированным .gif, она отлично воспроизводится при загрузке страницы (длится около 2 секунд).
При обновлении (F5) .gif перестает воспроизводиться, и отображается только последний кадр gif-анимации.
Есть ли что-нибудь, что я могу сделать, чтобы убедиться, что он воспроизводится каждый раз?
Для PHP гораздо лучший вариант, чем использование date("Ymdgis");, использует time(), например:
<img src="picturePath.gif?<?php echo time();?>" />
Странное поведение, которое влияет на каждый браузер..
Я обычно обновляю его вручную с помощью этого скрипта (он использует jQuery)
<img id="gif_animata" src="picturePath.gif">
<script type="text/javascript">
var gifSource = $('#gif_animata').attr('src'); //get the source in the var
$('#gif_animata').attr('src', ""); //erase the source
$('#gif_animata').attr('src', gifSource+"?"+new Date().getTime()); //add the date to the source of the image... :-)
</script>
Это обновит src изображения, добавив текущую дату, поэтому браузер повторно загрузит его, думая, что это новое изображение.
В противном случае в PHP (я предпочитаю этот):
<img src="picturePath.gif?<?php echo date("Ymdgis");?>" />
//for the browser it will seems that's a new picture!
<img src="picturePath.gif?2012092011207">
Обходной путь, который работает для меня для этой проблемы, — перезагрузить GIF вручную с помощью Javascript.
GIF реализован на CSS (фоновые изображения)
var element = document.getElementById(name);
element.style.backgroundImage = "none";
element.style.backgroundImage = "url(imagepath.gif?"+new Date().getTime()+")";
GIF реализован на HTML (тег img)
var element = document.getElementById(name);
element.src = "";
element.src = "imagepath.gif?"+new Date().getTime();
Благодаря @sekmo
Это работает, требуется только одна строка ниже, и я предлагаю сначала не заполнять атрибут <img> src, чтобы страница не пыталась загрузить ненужные ресурсы.
<img id="gif" src=""/>
<script>document.getElementById('gif').src="path_to_picture.gif?a="+Math.random()</script>
Возможно, ваш браузер просто показывает кешированную версию. Попробуйте удерживать Shift и обновить, и посмотрите, работает ли это.
