HTML

 Computer >> コンピューター >  >> プログラミング >> HTML
  1. HTML DOM Video posterプロパティとは？構文とサンプルコードで解説

    HTML DOM の Video poster プロパティは、動画が再生されるまで（またはネットワーク状態が「2（LOADING）」である間）表示されるポスター画像の URL に対応する文字列を、取得および設定できるプロパティです。 video 要素には poster 属性を指定することで、ユーザーが再生ボタンを押す前に表示されるサムネイル画像を設定できます。この属性の値を JavaScript から動的に読み書きするのが、DOM の poster プロパティというわけです。 構文 poster プロパティの基本的な構文は以下の通りです。 文字列値の取得 mediaObject.poster

  2. HTML DOM Video preloadプロパティの使い方を徹底解説

    HTML DOM Video preloadプロパティとはHTML DOM の Video preload プロパティは、動画データをいつ読み込むべきかを制作者が指定した値に対応する文字列を返します。この設定は、ブラウザ側の判断（通信環境やユーザー設定など）によって無視される場合がある点に注意してください。デフォルト値は 「metadata」です。構文以下が構文の基本形です。文字列値を取得する場合mediaObject.preloadpreload に文字列を設定する場合mediaObject.preload = auto | metadata | none;preload に指定できる値au

  3. HTML DOM Video readyStateプロパティの使い方を解説！戻り値の一覧とサンプルコード

    HTML DOM の Video readyState プロパティは、動画が現在どの程度再生可能な状態にあるかを示す数値を返します。この値を確認することで、メディアデータの読み込み状況を把握し、適切なタイミングで再生や操作を行うことができます。 構文 readyState プロパティの構文は以下のとおりです。 mediaObject.readyState 戻り値の一覧 このプロパティが返す数値とそれぞれの意味は次のとおりです。 0（HAVE_NOTHING）：利用可能な情報がまだ何もない状態 1（HAVE_METADATA）：メタデータの読み込みが完了し、動画のシーク（位置移動）が可能な状態

  4. HTML DOM Videoのseekableプロパティとは？シーク可能範囲の取得方法を解説

    HTML DOM Video の seekable プロパティとは HTML DOM の Video seekable プロパティは、動画内でシーク（再生位置の移動）が可能な範囲の情報を保持した TimeRanges オブジェクトを返します。このオブジェクトには、シーク可能な範囲の長さや、開始位置・終了位置が含まれています。 特にストリーミング配信では、動画データが完全に読み込まれる前に再生が始まるため、必ずしも動画全体を自由に移動できるとは限りません。seekable プロパティを使えば、「いまどこまで再生位置を動かせるのか」を JavaScript から正確に判定できます。 構文 seek

  5. HTML DOM Video seeking プロパティとは？使い方をサンプルコード付きで解説

    HTML DOM の Video seeking プロパティは、ユーザーが現在再生中の動画をシーク（再生位置を別の場所へ移動する操作）しているかどうかを示すブール値（true / false）を返します。このプロパティは、動画プレイヤーのカスタム UI を作成する際や、シーク中に特定のメッセージを表示したい場合などに活用できます。また、onseeking イベントや onseeked イベントと組み合わせることで、シーク操作の開始・終了のタイミングを検出することも可能です。構文seeking プロパティの構文は以下のとおりです。mediaObject.seeking戻り値はブール値で、ユーザー

  6. HTML DOM Video srcプロパティとは？動画URLの取得・設定方法を実例付きで解説

    HTML DOM の Video src プロパティは、<video> 要素で再生する動画のURL（ソース）に対応する文字列を取得、または設定するためのプロパティです。JavaScriptから動的に動画ファイルを差し替えたり、現在設定されているURLを参照したりする際に活用できます。構文srcプロパティの値を取得する場合mediaObject.srcsrcプロパティにURL文字列を設定する場合mediaObject.src = URLStringそれでは、HTML DOM Video src プロパティの具体的な使用例を見ていきましょう。サンプルコード以下の例では、ユーザー名として

  7. HTML DOM Video textTracksプロパティの使い方をわかりやすく解説

    HTML DOM の Video textTracks プロパティは、<video> 要素に関連付けられたテキストトラック（字幕やキャプションなど）の情報を格納した TextTrackList オブジェクトを返します。このプロパティを利用すると、JavaScript から動画に設定された字幕トラックの総数やラベル、言語などの情報を簡単に取得できます。 構文 textTracks プロパティの基本的な構文は以下の通りです。 mediaObject.textTracks 戻り値は TextTrackList オブジェクトであり、length プロパティでトラックの総数を取得したり、イン

  8. HTML DOM Video volumeプロパティとは？使い方とサンプルコードを解説

    HTML DOM の Video volume プロパティは、<video> 要素で再生中のメディアの現在の音量レベルに対応する数値を取得（返す）、または設定するためのプロパティです。JavaScript から動的に動画の音量を制御したい場合に活用できます。構文構文は以下のとおりです。音量を数値として取得する場合mediaObject.volume音量に数値を設定する場合mediaObject.volume = number注意： number に指定できる値の範囲は 0.0 ～ 1.0 です。最大値は 1.0（最大音量）、最小値は 0.0（無音）を表します。この範囲外の値を設定す

  9. HTML DOM Video durationプロパティとは？動画の長さ（秒数）を取得する方法を解説

    HTML DOM の Video duration プロパティは、動画の長さ（秒数）に対応する数値を返します。動画プレイヤーの再生時間表示や、動画の長さに応じた処理を行いたい場合に便利なプロパティです。注意点：ライブストリームの場合ライブ配信（ライブストリーム）に対してこのプロパティを使用した場合、「Inf」（無限大）が返されます。これは、ライブストリームには事前に定義された長さが存在しないためです。ライブ配信を扱う際は、この挙動に注意してコードを記述する必要があります。構文（Syntax）duration プロパティの構文は以下のとおりです。mediaObject.duration引数を取ら

  10. HTML DOM Video ended プロパティとは？使い方をサンプルコード付きで解説

    HTML DOM の Video ended プロパティは、動画が最後まで再生し終えたかどうかを示すブール値（true/false）を返します。動画再生の進行状況を判定したい場合に便利なプロパティです。構文ended プロパティの構文は以下の通りです。ブール値を返す場合：mediaObject.ended戻り値の意味は次の通りです。true：動画の再生が終端に達しているfalse：動画の再生がまだ終わっていないそれでは、HTML DOM Video ended プロパティの具体的な使用例を見ていきましょう。サンプルコード<!DOCTYPE html> <html> &l

  11. HTML DOMのVideo heightプロパティの使い方を解説

    HTML DOMのVideo heightプロパティは、メディア（動画）の高さに対応する数値（ピクセル単位）を取得・設定するために使用されます。このプロパティを活用することで、JavaScriptから動的に動画要素の表示サイズを制御できるようになります。 構文heightプロパティの構文は以下のとおりです。 height値の取得（ピクセル単位）mediaObject.height height値の設定（ピクセル単位）mediaObject.height = number それでは、Video heightプロパティの具体的な使用例を見ていきましょう。 サンプルコード<!DOCTYPE h

  12. HTML DOM Video load()メソッドの使い方を解説！動画の再読み込み方法とサンプルコード

    HTML DOMのVideo load()メソッドは、src属性などの特定の属性がユーザーやスクリプトによって更新された後に、その変更内容を反映させるためにvideo要素を再読み込み（再レンダリング）するために使用されます。 構文 load()メソッドの構文は以下の通りです。 videoObject.load() このメソッドは引数を受け取らず、戻り値も返しません。load()が呼び出されると、メディア要素がリセットされ、選択されているリソースが最初から再び読み込まれます。そのため、再生速度や再生位置などの設定を変更した場合でも、load()を実行することで確実に新しい状態へ反映させることがで

  13. HTML DOM Video loopプロパティの使い方｜動画の自動リピート再生を設定する方法

    HTML DOM の Video loop プロパティは、動画（<video> 要素）の再生が終了したときに、自動的に最初から再再生するかどうかを表すブール値（true / false）を取得または設定するためのプロパティです。構文loop プロパティの値を取得するmediaObject.looploop プロパティに値を設定するmediaObject.loop = booleanValueここで指定できる booleanValue は以下の通りです。booleanValue説明true動画の再生が終了すると、自動的に最初から再び再生されますfalse動画の再生が終了しても、自動的

  14. HTML DOM Video mutedプロパティとは？使い方をサンプルコード付きで解説

    HTML DOMのmutedプロパティは、<video>要素の音声がミュートされているかどうかを示すブール値（true / false）を取得・設定できるプロパティです。動画プレイヤーにミュート機能を実装したい場合などに活用できます。mutedプロパティの構文構文は以下のとおりです。ブール値を取得する場合（true / false）mediaObject.mutedミュート状態を設定する場合mediaObject.muted = booleanValuebooleanValueには、次のいずれかの値を指定します。booleanValue説明true動画の音声がミュートされることを表

  15. HTML DOM Video networkStateプロパティとは？使い方と戻り値を解説

    HTML DOM Video の networkState プロパティは、video 要素の現在のネットワーク状態に対応する数値を返します。このプロパティを利用することで、動画の読み込み状況やネットワークの利用有無などを JavaScript から動的に確認できます。 構文 networkState プロパティの基本構文は以下のとおりです。 数値を取得する場合 mediaObject.networkState 戻り値として返される可能性のある数値と、それぞれが表す状態は次のとおりです。 0（NETWORK_EMPTY） … メディアがまだ初期化されていない状態 1（NETWORK_IDLE）

  16. 【初心者向け】HTML DOM Videoオブジェクトとは？主要プロパティ・メソッドをサンプルコード付きで解説

    HTML DOM の Video オブジェクトは、HTML の <video> 要素を JavaScript から操作するためのインターフェースです。この記事では、Video オブジェクトの生成方法、利用できるプロパティやメソッドの一覧、そして実際に動くサンプルコードを交えてわかりやすく解説します。 Videoオブジェクトの作成方法 <video> 要素は、JavaScript の createElement() メソッドを使って動的に生成できます。 var videoObject = document.createElement(VIDEO) こうして作成した vi

  17. HTML DOM Videoのpausedプロパティとは？動画の再生状態を判定する方法を解説

    HTML DOM の Video paused プロパティは、動画が現在再生中かどうかに応じて真偽値（true / false）を返します。動画が一時停止中または未再生の状態であれば true、再生中であれば false が返されます。このプロパティは読み取り専用であり、JavaScript から動画プレイヤーの状態を確認したい場合に非常に便利です。例えば、動画が一時停止されたタイミングで画面を暗くする演出など、再生状態に応じた UI の切り替えに活用できます。構文paused プロパティの構文は以下の通りです。真偽値を返す場合：mediaObject.pausedここで mediaObjec

  18. HTML DOM Video play()メソッドの使い方を徹底解説！動画再生をJavaScriptで制御する方法

    HTML DOM の Video play() メソッドは、現在読み込まれている動画（メディアコンテンツ）を再生するために使用されるメソッドです。逆に、再生中の動画を停止したい場合は pause() メソッドを使用します。この2つのメソッドを組み合わせることで、JavaScript から動画プレイヤーの再生・一時停止を自由に制御できます。 構文 play() メソッドの基本的な構文は以下の通りです。 videoObject.play() なお、play() メソッドは Promise オブジェクトを返します。そのため、.then() や .catch() を使うことで、再生が正常に開始された

  19. HTML DOM URLプロパティとは？使い方とサンプルコードを解説

    HTML DOM の URL プロパティは、現在のドキュメント（ページ）の URL に対応する文字列を返すプロパティです。読み取り専用のため、JavaScript からページの完全な URL を簡単に取得できます。 構文 URL プロパティの値を取得する基本的な構文は以下の通りです。 document.URL このプロパティは引数を取らず、ドキュメントの URL を文字列として返します。なお、類似の機能を持つ document.location.href との違いとして、document.URL は読み取り専用である点が挙げられます。 HTML DOM URL プロパティの使用例 ここでは、ボ

  20. HTML DOM valueプロパティとは？属性値の取得方法とサンプルコードを解説

    HTML DOMのvalueプロパティは、要素が持つ属性（attribute）の値に対応する文字列を返すプロパティです。JavaScriptからHTML要素の属性値を読み取りたい場合に活用できます。基本構文valueプロパティの基本的な書き方は以下の通りです。elementAttribute.value対象となる属性オブジェクトに対して.valueを指定することで、その属性が保持している値を文字列として取得できます。実装例ここでは、画像タグ（<img>）のsrc属性の値をボタンクリック時に取得して画面に表示するサンプルを紹介します。<!DOCTYPE html> <

Total 2020 -コンピューター  FirstPage PreviousPage NextPage LastPage CurrentPage:11/101  20-コンピューター/Page Goto:1 5 6 7 8 9 10 11 12 13 14 15 16 17