<video>

動画コンテンツを表示します

<video width="320" height="240" controls>
  <source src="movie.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
  <source src="movie.webm" type='video/webm; codecs="vp8, vorbis"'>
  <source src="movie.ogv" type='video/ogg; codecs="theora, vorbis"'>
</video>

説明

<video> タグは HTML5 で追加されました。ページに動画コンテンツを埋め込む際に使用されます。<video> タグをサポートしないブラウザではタグ内に記述された代替手段が表示されます。

Attributes Table

属性 説明
エレメント属性
autoplay 自動的に再生を開始します
    controls 再生のためのコントローラーを表示します
      height ビデオの高さを指定します
        loop ビデオのループ再生を指定します
          preload 再生前に動画を予め読み込みます
            src 再生するビデオの URL を指定します
              width ビデオの幅を指定します
                スタンダード属性
                accesskey 各要素へ移動するキー操作を定義します
                class その要素のクラス名です
                contenteditable 要素が編集可能かを指定します
                contextmenu 要素に対応するメニューを指定します
                dir テキストの方向を指定します
                draggable ドラッグ可能かを指定します
                hidden 要素を隠すかどうかを指定します
                id その要素を識別するための固有の識別子です
                itemprop 要素のマイクロデータプロパティを定義します
                itemscope 要素のマイクロデータグループを作成します
                lang 要素内で使われている言語を指定します
                spellcheck 要素のスペルチェックを制御します
                style CSS スタイルを記述します
                subject マイクロデータプロパティを関連付けます
                tabindex Tab キーによってフォーカスが移動する順番を指定します
                title この要素に補足情報を足します
                translate 要素のコンテンツの翻訳ツールを設定します
                xml:lang 要素内で使われている言語を指定します

                DOM リファレンス

                ハンドラ 説明
                イベントハンドラ
                onchange 属性値の変更時に実行されます
                onclick 要素のクリック時に実行されます
                oncontextmenu コンテキストメニュー使用時に発生するイベント
                ondblclick 要素のダブルクリック時に実行されます
                ondrag 要素のドラッグ時に発生するイベント
                ondragend ドラッグ操作の完了時に発生するイベント
                ondragenter 有効なドロップ先への要素のドラッグ操作完了後に発生するイベント
                ondragleave 有効なドロップ先から要素が離れた際に発生するイベント
                ondragover 要素が有効なドロップ先の上に存在している間に発生するイベント
                ondragstart ドラッグ操作の開始時に発生するイベント
                ondrop ドラッグされた要素のドロップ時に発生するイベント
                onfocus 要素のフォーカス時に実行されます
                onformchange フォームの変更時に発生するイベント
                onforminput フォームの入力時に発生するイベント
                oninput ユーザの要素への入力時に発生するイベント
                oninvalid 要素の無効時に発生するイベント
                onkeydown キーボードの打鍵時に実行されます
                onkeypress キーボードを打鍵し放された際に実行されます
                onkeyup キーが放された際に実行されます
                onmousedown マウスボタンの押下時に実行されます
                onmousemove マウスポインタの移動時に実行されます
                onmouseout 要素からマウスポインタが離れた際に実行されます
                onmouseover 要素へマウスポインタが合った際に実行されます
                onmouseup マウスボタンが放された際に実行されます
                onmousewheel マウスホイールの使用時に発生するイベント
                onreset フォームのリセット時に実行されます
                onscroll 要素のスクロール時に発生するイベント
                onselect 要素の選択時に実行されます
                onsubmit フォームの送信時に実行されます
                メディアイベントハンドラ
                onabort メディアの読込が不正終了した際に発生するイベント
                oncanplay メディアが再生を開始できる際に発生するイベント
                oncanplaythrough メディアが最後まで再生した際に発生するイベント
                ondurationchange メディアの変更中に発生するイベント
                onemptied メディアのリソースが空の際に発生するイベント
                onended メディアの再生が最後に達した際に発生するイベント
                onerror 要素の読込中にエラーが起こった際に発生するイベント
                onloadeddata メディアのリソースが読み込まれた際に発生するイベント
                onloadedmetadata メディアのメタデータが読み込まれた際に発生するイベント
                onloadstart メディアの読込が開始された際に発生するイベント
                onpause メディアが一時停止された際に発生するイベント
                onplay メディアが再生される直前に発生するイベント
                onplaying メディアの再生中に発生するイベント
                onprogress ブラウザが追加のメディアデータを受け取った際に発生するイベント
                onratechange メディアの再生レートが変更された際に発生するイベント
                onreadystatechange メディアの待機状態が変更された際に発生するイベント
                onseeked メディアリソースのシーク時に発生するイベント
                onseeking メディアのシーク時に発生するイベント
                onstalled メディアの読込が停止した際に発生するイベント
                onsuspend メディアの終了前にブラウザが情報の取得を停止した際に発生するイベント
                ontimeupdate メディアの再生位置を変更した際に発生するイベント
                onvolumechange メディアのボリュームを変更した際に発生するイベント
                onwaiting メディアの再生を停止し、再開させる場合に発生するイベント