web-dev-qa-db-ja.com

GIFVは常にビデオを再生するとは限りません

これを考慮して、「GIFV good」: http://i.imgur.com/SQXB06O.gifv

これを考慮して、「GIFV bad」: http://i.imgur.com/MHfD9WX.gifv

現在、これらは両方とも最近のアップロードです。それぞれ13時間と15時間。ただし、1つはビデオとして再生され、もう1つはGIFとして再生されます。 GIFV goodを右クリックするとPauseと表示されるため、一方、GIFV badを右クリックすると、View Imageと表示されます。

GIFV badに利用可能なビデオがあることを知っています:

$ wget --spider http://i.imgur.com/MHfD9WX.webm
HTTP request sent, awaiting response... 200 OK
Length: 542519 (530K) [video/webm]

ただし、 http://i.imgur.com/MHfD9WX.webm を直接試すと、GIFVにリダイレクトされ、GIFが再生されます。

この動作の原因は何ですか?

7
Steven Penny

Imgurスタッフによる

元のGIFが2M未満の場合は表示されます


Imgurに本当に欲しいのは、メディアがYouTubeビデオのように振る舞うことです。

  • 一回プレイ
  • クリックでリプレイ

私はこれを達成することができました。最初に GIFループの停止 Firefoxの場合:

image.animation_mode; once

それから ブックマークレット を作成して残りを行います:

addEventListener('timeupdate', function(wh) wh.target.loop = 0, 1);
xr = document.querySelectorAll('img, video');
for (ya of xr) {
  zu = ya.style;
  zu.boxSizing = 'border-box';
  if (ya.play) {
    zu.border = 'thick solid Violet';
    zu.position = 'relative';
    zu.zIndex = 10;
    if (ya.duration) zu.display = 'block';
    ya.onmouseover = function() this.controls = 1;
    ya.onclick = function() {
      this.parentNode.replaceChild(this.cloneNode(1), this);
      this.src = '';
    };
  }
  else {
    ya.onclick = function() this.src = this.src;
    zu.border = /gif/.test(ya.src) ? 'thick solid green' : 'thick solid peru';
  }
}

これにより、ビデオのループが停止し、クリック時にメディアが再生されます。

6
Steven Penny