ホームページ > 記事 > ウェブフロントエンド > HTML5動画の基礎知識まとめ
1. video タグの基本属性
1.autoplay="autoplay": 準備が整うとすぐに動画の再生を開始することを指定します
2.control="controls": ブラウザーにデフォルトの一時停止と進行を提供させますビデオプレーヤーコントロールのバーなど。これを設定すると、独自定義のコントロールは使用できなくなります。
3.width="320" height="240": ビデオプレーヤーの幅と高さを定義します。これを設定すると、ページでビデオ プレーヤー用のスペースの一部を予約できるようになります。設定されていない場合、最初は予約されず、ページ レイアウトが混乱する可能性があります
4.loop="loop":ビデオの終了後にビデオが再開されることを規定します
5 .preload 属性: auto はページがロードされた後にビデオ全体をロードすることを意味します。meta はメタデータのみをロードします。none: ビデオをロードしません。
6.src: を指定します。ビデオを再生するための URL、サポートされているビデオ形式: MP4/WebM/Ogg
2. よく使用されるビデオ API
1.currentTime: 現在の再生時間を示します。js 操作を通じて変更できます。再生の進行状況に反映されます
2.load() メソッド: ビデオをロードします。play() メソッド: ビデオを再生します。pause() メソッド: ビデオを一時停止します
3.volume: 現在のサウンドのサイズを示します。 js で調整します
4.muted: true はミュート、false はミュートされていないことを意味します
5.playbackRate: 再生速度を設定します。デフォルトは 1 で 1 秒で再生します
3. js を使用してビデオ インスタンスを制御します
要素セレクターを通じて、対応する 39000f942b2545a5315c57fa3276f220 要素を取得します: var myVideo = document.getElementById( "video")
myVideo.play(): ビデオの再生を開始します。ビデオの再生 myVideo.height と myVideo.width を通じてビデオのサイズを設定できます 4. ソース e02da388656c3265154666b7c71a8ddc をタグ 39000f942b2545a5315c57fa3276f220 内に配置できます。<video id=“video” width=“420”> <scource src=“a.mp4” type=“video/mp4”> <scource src=“a.ogg” type=“video/ogg”> </video>【関連する推奨事項】1. IIS の MIME が登録されていない MP4 タイプ、vidoe タグを認識できない問題の解決策
2. H5 video タグで音声のみ再生できて動画が再生できない問題の解決策
3. video タグが mp4 を再生できない問題と解決策を共有します
4. video 要素を使用して動画を作成します。 html5のプレーヤー
5.以上がHTML5動画の基礎知識まとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。