2

ビデオ オブジェクトを保持する div がいくつかあります。サムネイルをクリックするだけで再生されます。しかし、ユーザーが別の選択肢をクリックすると、ビデオが「舞台裏」で再生され続けるという問題がありました。だから、仲間のOverflowerからこれを入手して、ビデオを「停止」し、最初のフレームに戻し、フェードアウトしてから、次に選択したビデオをフェードインして再生します。

jQueryスクリプトは次のとおりです。

$(function(){
$('div.video').hide();

$('.icon').click(function(){
    var id=$(this).data('id'),
        thisDiv=$("div.video[data-id='" + id +"']"),
        thisVideo=$("div.video[data-id='" + id +"']").find('video');

    $('video').each(function () {
        this.pause();
        this.currentTime = 0;
    });

       $('div.video').not(thisDiv).fadeOut();

       thisDiv.fadeIn();      
       thisVideo.get(0).play();   
});
});

そして、ビデオ オブジェクトの 8 つの div の 1 つの html:

<div class="video" data-id="1" >
<video width="auto" height="100%" controls="controls">
  <source src="videos/video.mp4" type="video/mp4" />
  <source src="videos/video.ogv" type="video/ogg" />
  <source src="videos/video.webm" type="video/webm" />
<object data="videos/video.mp4" width="auto" height="100%">
  <embed src="videos/video.swf" width="auto" height="100%" />
</object> 
</video>
</div>

そしてそれは機能します...ほとんどの場合。時々、次のエラーが表示されます。

this.currentTime = 0; Uncaught Error: INVALID_STATE_ERR: DOM Exception 11

Chrome のエラー ログ。IE8 でも同じエラーが表示されます。

これが何であるか知っている人はいますか?そして、それを修正するために何ができますか?

4

0 に答える 0