コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > H5 チュートリアル > HTML5 Video オブジェクトの ontimeupdate イベントに関する質問 (Chrome では無効) _html5 チュートリアルのヒント

HTML5 Video オブジェクトの ontimeupdate イベントに関する質問 (Chrome では無効) _html5 チュートリアルのヒント

WBOY
リリース： 2016-05-16 15:49:07
オリジナル
1935 人が閲覧しました

Date は HTML5 Video オブジェクトを使用してビデオ再生ページを作成しています。これは、複数の異なる形式のビデオのオンライン再生をサポートしており、多くのイベントを渡すことができます。ビデオの再生を制御します。次の 2 つのリンクを参照してください:
http://msdn.microsoft.com/en-us/library/windows/apps/hh465962.aspx
http://www.w3school.com.cn/html5/ tag_video .asp

Video オブジェクトは、ontimeupdate イベントを通じて現在の再生の進行状況を報告できます。同時に、このイベントを使用して、ビデオの再生状況に基づいてページ上の他の要素を制御することもできます。ビデオ再生の進行に合わせてチャプターを切り替えたり、追加情報を表示したりします。以下に例を示します:

コードをコピーします
コードは次のとおりです:









: 0
;input type= "text" id="seekText" />
例:





コードをコピー

コードは次のとおりです:


video.ontimeupdate = function () { getCurrentVideoPosition();
ただし、上記のコード行は、addEventListener を使用して置き換えることができます。 >
コードをコピー


コードは次のとおりです:


videoPlayer.addEventListener("timeupdate", function () { getCurrentVideoPosition(); }, false);
なぜ ontimeupdate イベントを Chrome の Video 要素に直接ハングできないのかわかりませんが、イベントはaddEventListener メソッド。ただし、addEventListener は IE および Firefox ブラウザーとも互換性があるため、パスするはずです。
関連ラベル：
html5
ソース：php.cn
前の記事：Canvas_html5 チュートリアル スキルを使用する際の注意点まとめ 次の記事：HTML5 ファイルを使用して、base64 を image_html5 に変換するチュートリアル スキル
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
ページのメインディスプレイに画像を表示するにはどうすればよいですか? 私がやりたいのは、NASAAPI を使用して写真を受信することです。これらの写真は、マイページのサムネイルとメインディスプレイに表示されます。コードがサムネイルから画像を取得してペ...
から 2024-04-06 15:33:12
0
1
433
PDF ファイルは HTML5 と JavaScript を実行できますか? PDF に埋め込まれるため、どのコンピュータでもブロックされないプログラムを作成してみようという愚かな考えがあります (JavaScript は PDF 内で実行できると聞きました...
から 2024-04-05 12:57:00
0
1
456
HTML5 の enctype と formenctype の違いは何ですか? HTMLLivingStandard (別名、新しい HTML5 仕様) の属性 enctype と formenctype の違いは何でしょうか?私は HTML Standard...
から 2024-04-02 11:47:56
0
1
275
ページをモバイル対応にしますか? たくさんの Web ページといくつかの Web サイトがあります。問題は、私は初心者だということです。基本的な html5 と css3 を使用していますが、それらをスケールアップ...
から 2024-04-01 20:42:38
0
1
259
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート