HTML5 Videoでは、長い動画から小さなクリップを再生する方法は？

10分以上の長いビデオファイルから小さなクリップを見せたいと思います。このビデオセグメントは、90秒の時間オフセット/シーク時間で開始し、45秒の持続時間を有する。どうやってやるの？HTML5 Videoでは、長い動画から小さなクリップを再生する方法は？

出典

2012-03-23 user193116

この方法では、ビデオ全体（ファイルサイズの点ではかなり大きい可能性があります）をクライアントのデバイスに転送することに注意してください。ユーザーフレンドリーなアプローチは、既に編集中にこれを解決し、スニペットをカバーする特定のファイルを提供するでしょう。 – m90

フィリップブラウンです。 js経由でyout html-playerを制御することでこれを解決できます。この場合、例えば、ビデオが自動起動だろうとvideofileを再生しますべき00：10分00：40分

<video id="yourVideoplayer" width="640" height="480" preload="auto"> //preload="auto" buffers the video if initialize. you cannot seek a video which isn t buffering already 
    <source src="test.mp4" type="video/mp4" /> 
    <source src="test.ogv" type="video/ogg" /> 
    This browser is not compatible with HTML 5 
</video> 

<script type="text/javascript"> 
    window.onload = playVideoTeaserFrom(10,40); //this event will call the function after page was loaded 

    function playVideoTeaserFrom (startTime, endTime) { 
     var videoplayer = document.getElementById("yourVideoplayer"); //get your videoplayer 

     videoplayer.currentTime = starttime; //not sure if player seeks to seconds or milliseconds 
     videoplayer.play(); 

     //call function to stop player after given intervall 
     var stopVideoAfter = (endTime - startTime) * 1000; //* 1000, because Timer is in ms 
     setTimeout(function(){ 
      videoplayer.stop(); 
     }, stopVideoAfter); 

    } 
</script>

そこではいくつかのバグも、私はあなたがポイントを得るでしょう想像

出典

2012-03-23 23:37:42 longilong

この機能は動作していないようです。ビデオは通常、全長で動作しています。 – imbenzene

これは、@ longongongが 'window.onload'を未定義に設定していることと、コードに関する他の問題が原因です。明らかなバグがあります。 – Sam

ユーザーがマウスで早送りまたは巻き戻しをすると、タイマーは予想どおりの特定の時間に停止します。 – jRam90

HTML5ビデオは、Media Fragment URI仕様もサポートしています。これにより、再生するビデオのセグメントのみを指定できます。それを使用することはかなり簡単です：

<source src="video.mp4#t=30,45" type="video/mp4"/>

は、30秒のマークでビデオを開始し、45秒のマークでビデオを一時停止します。

出典

2013-06-07 20:29:09

Chromeが残りの動画を引き続きダウンロードしていることに気付いた点に留意してください。 45秒でビデオを一時停止しますが、ユーザーはその時点から再生を再開できます。トラフィックを制限したり、ビデオの残りの部分をカットする手段としてこれを検討している場合、これはあなたの解決策ではありません。 – villecoder

これを防ぐには、ビデオプレーヤーコントロールを操作する必要があります。動画が45秒の位置にあるときに再生ボタンを押すと、ビデオプレーヤーを30秒間ビデオに戻すことができます。この種の機能を実現するために、srcからメディアフラグメントを解析するのはかなり簡単です。 –

これがすべての主要ブラウザで広くサポートされている場合は、それが受け入れられる回答である必要があります。 – TimHayes

HTML5 Videoでは、長い動画から小さなクリップを再生する方法は？

答えて

関連する問題