DOM

HTMLVideoElement.videoHeight プロパティ

 編集:2022.11.10 by T.A.

[Edge]。読取専用。→

HTMLVideoElement の ビデオの元の画素構成の縦ピクセルを表す数値で返します。

mdn: CSS ピクセルで表されたビデオの固有の高さを示します。簡単に言うと、これはメディアの自然なサイズでの高さです。

mdn: 詳細については、「固有の幅と高さについて」を参照してください。

構文
HTMLVideoElement.videoHeight
HTMLVideoElement HTMLVideoElement

整数数値。

mdn: 要素の readyState が HTMLMediaElement.HAVE_NOTHING の場合、ビデオもポスターのフレーム サイズ情報もまだ利用できないため、このプロパティの値は0です。

関連

videoWidth

/mdn

この例では、コンテンツの固有のサイズに一致するように <video> 要素のサイズを変更する resize イベントのハンドラーを作成します。

let v = document.getElementById("myVideo");

v.addEventListener("resize", ev => {
  let w = v.videoWidth;
  let h = v.videoHeight;

  if (w && h) {
    v.style.width = w;
    v.style.height = h;
  }
}, false);

これは、videoWidth と videoHeight の両方がゼロ以外の場合にのみ変更を適用することに注意してください。これにより、ディメンションについて利用可能な真の情報がまだない場合に無効な変更を適用することを回避できます。

HTML:

<VIDEO id=IdTest width=300 height=100 style="background-color:#dfd" src="../../Sample/Eizou_M.mp4"></VIDEO>

JavaScript:

D=IdTest.videoWidth;  //=[number]:320
DA=IdTest.videoHeight;  //=[number]:264

元のビデオの構成サイズが得られた。


テスト