WEBデザインの勉強

WEB制作初心者が1から勉強するブログ。

gifアニメーションがリロードすると再生されない

gifアニメーションを含んだwebページをリロードすると、
gifアニメーションが再生されず、最後のコマで止まっている現象が起こることがある。
この原因はキャッシュが残っているために起こる。

gifの名前の後ろに「?現在時刻」(クエリー)を入れることで
毎度のロード時にgifの名前が変更される。
そのためもう一度gifを読み込みアニメーションを再生してくれるようになる。

$(function(){
  var _timeStamp = (new Date).getTime();
  var $elemGif   = $('.gif').find('img');
  $elemGif.attr('src', $elemGif.attr('src')+'?'+_timeStamp);
});