Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

HTML5ビデオまたはオーディオプレイリスト

JavaScriptでHTMLを使用してプレイリストを追加します。 推奨 イベントは、オーディオ/ビデオが終了したときに発生します。 「ご覧いただきありがとうございます」、「お楽しみに！」などのメッセージを追加できます

例

次のコードを実行して、 onendedを実装してみてください。 属性-

<!DOCTYPE HTML>
<html>
   <body>
      <video width = "300" height = "200" controls onended = "display()">
         <source src = "/html5/foo.ogg" type = "video/ogg" />
         Your browser does not support the video element.
      </video>
      <script>
         function display() {
            alert ("Thank you for watching! Stay tuned!");
         }
      </script>
   </body>
</html>

次のクリップをonendedに読み込むことができます 以下のコードのようなイベント

<script >
   var next = "path/of/next/video.mp4";
   var video = document.getElementById('video');
   video.onended = function(){
   video.src = next;
}
</script>
<video id = "video" src = "path/of/current/video.mp4" autoplayautobuffer controls />

  1. HTMLDOMビデオのシーク可能なプロパティ

    HTML DOMビデオシーク可能プロパティは、ビデオのシーク可能範囲の長さとその開始、終了位置に関する情報を含むTimeRangesオブジェクトを返します。 構文 以下は構文です- TimeRangesオブジェクトを返す mediaObject.seekable 検索可能な動画の例を見てみましょう プロパティ- 例 <!DOCTYPE html> <html> <head> <title>HTML DOM Video seekable</title> <style>    * {   &

  2. HTMLDOMビデオプリロードプロパティ

    HTML DOMビデオプリロードプロパティは、作成者がビデオデータをロードする必要があると考えたときに対応する文字列を返します。無視されることもありますが、デフォルト値は「メタデータ」です。 構文 以下は構文です- 文字列値を返す mediaObject.preload プリロードの設定 文字列に mediaObject.preload = “auto|metadata|none” HTMLDOMビデオプリロードの例を見てみましょう プロパティ- 例 <!DOCTYPE html> <html> <head> <titl