20

毎回ファイルをダウンロードせずにgifアニメーションを再開することはできますか? 私の現在のコードは次のようになります。

var img = new Image();
img.src = 'imgages/src/myImage.gif';

$('#id').css('background-image', 'url("' + img.src + '?x=' + Date.now() + '")' );

編集

gif を dom に挿入すると、gif アニメーションが再開されませんでした。イメージ src にランダムな文字列を追加することによってのみこれを達成できますが、これによりイメージが再度ダウンロードされます。

GIFをダウンロードせずにGIFアニメーションを再開できるかどうか知りたいです。

4

10 に答える 10

9

同様の要件がありました。

var img = document.createElement("img"),
    imageUrl = "http://i73.photobucket.com/albums/i231/charma13/love240.gif";
img.src = imageUrl;
document.body.appendChild(img);

window.restartAnim = function () {
    img.src = "";
    img.src = imageUrl;
}
于 2014-07-17T17:47:49.500 に答える
6

たとえば facebook では、アニメーション化された絵文字は .gif ではなく、背景オフセットが動的に設定された png ファイル上の静的フレームのセットです。このようにして、JavaScript からアニメーションを完全に制御できます。アニメーションを一時停止/一時停止解除したり、速度を変更したりすることもできます。

.gif ファイルを別々のフレームに分割し、サーバー側で動的に .png ファイルを生成することができます。

これは私にとって良い週末のプロジェクトのようです ;)

于 2013-11-07T09:10:29.130 に答える
-1

JavaScriptで関数を作成し、同じ場所に画像を再配置します。GIFを再生したいときは、この関数を呼び出します。

function replayGif(){
   var img = new Image();
   img.src = 'imgages/src/myImage.gif';

   $('#id').css('background-image', 'url("' + img.src + '?x=' + Date.now() + '")' );
}
于 2013-11-07T10:32:27.927 に答える
-1

これはあなたを助けるかもしれません、

var img = new Image();
src = 'imgages/src/myImage.gif';
img.src=src;
$('body').append(img);
setInterval(function(){
    t=new Date().getTime();
    $("img").attr("src", src+'?'+t);
},5000);
于 2013-11-07T08:55:43.043 に答える
-1

最も単純な JavaScript ソリューション:

関数：

function restartGif(ImageSelector){
  var imgSrc=document.querySelector(ImageSelector).src;
  document.querySelector(ImageSelector).src=imgSrc;
}

呼び出し機能:

restartGif(SELECTOR) // Example: restartGif('.homer')

例: http://jsfiddle.net/nv3dkscr/

于 2013-11-08T22:09:33.863 に答える
-1

永遠にループさせるだけですか？それ以外の場合は、(gif の期間) ごとに ajax 要求を使用して再起動することができます。

JavaScript を使用しても可能です。

var gif
window.onload=function () {
  gif=document.getElementById('id')
  setInterval(function () {
    gif.src=gif.src.replace(/\?.*/,function () {
      return '?'+new Date()
    })
  },5000)//duration of your gif
}
于 2013-11-07T08:46:59.023 に答える