HTML5 videoでニコニコ動画風プレーヤーを作ろう (4/7)
テロップを外部データとして用意する サンプル01ではHTMLにテロップとして表示する文字を直接記述していましたが、これでは後からテロップの内容を変更できません。そこで、JSON形式のファイルで用意したテロップデータをスクリプトで読み込んで表示するように変更します。JSONファイルでは複数のテロップを記述でき、表示する文字と表示するタイミングを設定できるようにします。 また、単にJSONファイルを読み込んで表示するだけでなく、動画を再生しながらテロップを変更できるようにします。動画の横にJSONファイルから読み込んだテキストエリア（textarea）を配置し、テキストエリア内を書き換えるとテロップに反映されるようにします。 テロップデータは以下の形式にしてあります。 { 'id':'ID名', 'sec': 表示開始秒数, 'text':'流すテロップ' } id名はdiv要素のid属性です
07. video／audio要素のイベントを捕捉する » HTML5 -
videoaudio要素は、メディアデータの読み込みや再生中にさまざまなイベントを発生させる。このイベントをJavascriptで捕捉して、処理を行うことが可能である。発生するイベントの種類は非常に多く、これらをきちんと理解して詳細なイベント処理を行うことで、ユーザーフレンドリーで使いやすいメディアプレーヤーを作ることができる。 例えば、再生位置が進ごとに発生する「timeupdate」というイベントがある。このイベントを捕捉して、現在どこまで再生が進んでいるかを表示することができる。 < !DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>VideoPlayer</title> <script type="text/javascript"> function playOrPauseVideo() { var videoUr
MediaElement.js - HTML5 video and audio unification framework
MediaElement.js Plugins Boost your player with Chromecast, Google Analytics and more Look good. Sound good. MediaElement.js is a blazingly fast and amazingly powerful HTML5 audio and video library that creates a unified feel for media files (MP4, MP3), streaming content (HLS, M(PEG)-DASH), and embeddable players like YouTube, Vimeo, Twitch, DailyMotion, Facebook, and SoundCloud.
【レビュー】HTML5 VideoまとめとMediaElement.js | エンタープライズ | マイコミジャーナル
Technology and web development in curly bracket languages {Javascript, C#, ActionScript} HTML5 Videoはそのコーデックまでは規約では規定されていない。現在のところH.264、OGG、WebMという3つのコーデックが有力視されており、ブラウザにおけるサポートもさまざまだ。IE9以前のIEのようにHTML5 Videoをサポートしていないブラウザに対応することも考えると、FlashやSilverlightのサポートも必要になってくる。こうした現状に対応するためいくつかのテクニックとJavaScriptフレームワークとプレーヤが登場している。実現方法はさまざまだが、そのほとんどがHTML5 Videoをサポートしていればそれを使い、そうでなければ最終的にFlashを受け皿に使うといった仕組みを採用し
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
