HTML5 Video + DOM
HTML5 <video> - DOM を使用してコントロールを取得
HTML5 の <video> 要素には、メソッド、プロパティ、イベントもあります。
例えば、再生、一時停止、ロードするためのメソッドがあります。
読み込みまたは設定できるプロパティ(例えば duration、volume、seeking)があります。
例えば、<video> 要素の再生が始まるとき、一時停止するとき、終了するときなどに、
ユーザに通知することのできる DOM イベントもあります。
以下の例は、<video> 要素のプロパティの読込みと設定、
メソッドのコールを処理する方法を簡単な方法で説明しています。
例 1
ビデオ用の簡単な再生/一時停止 + リサイズコントロールを作成します:
Video courtesy of Big Buck Bunny.
上記例では、2つのメソッド: play() と pause() をコールしています。
また、3つのプロパティ: paused、height、videoHeight も使用しています。
Try it yourself »
HTML5 <video> - メソッド、プロパティ、イベント
下記テーブルは、殆んどのブラウザがサポートしているメソッド、プロパティ、イベントの一覧です:
メソッド |
プロパティ |
イベント |
play() |
currentSrc |
play |
pause() |
currentTime |
pause |
load() |
videoWidth |
progress |
canPlayType |
videoHeight |
error |
|
duration |
timeupdate |
|
ended |
ended |
|
error |
abort |
|
paused |
empty |
|
muted |
emptied |
|
seeking |
waiting |
|
volume |
loadedmetadata |
|
height |
|
|
width |
|
注: video プロパティのうち、videoWidth と videoHeight だけは直ぐに使用することができます。
他のプロパティは、動画のメタデータがロードされた後に利用可能になります。
|