HTML5で実装する動画コンテンツに字幕を付けるライブラリ・Cuepoint JS
なかなかユニークだったのでメモがてら。 HTML5で実装する動画コンテンツに字幕 を加える、というjsライブラリです。思いつき ませんでしたけど、こう言うことも出来てし まうんですね・・・HTML5ってやっぱり凄い かも・・（今さらですけどｗ なかなか面白い発想ではないですかね。動画そのものにいれるのが一般的ですけど、簡単なものでいいならこの方法も有りかなと。 上部にHTMLでキャプションが入っています。再生すると、動画が進み、場面に応じてテキストが分かります。 時間がたつと別のメッセージが表示されます。 キャプションの埋め方$(document).ready(function(){ //Slides object with a time (integer) and a html string var slides = { 0: "This is the first subtitle. Y
WWW.AKIRAFUKUOKA.COM BLOG | 今VJするならブラウザででしょ！ HTML5でVJアプリ「Fi-VJ」を制作しました
HTML5ならのVJアプリだって作れるはず！で、作りました Fi-VJ ver1.02 デモページはこちら ファイルダウンロードはこちら (ver1.02) DLしたら@akirafukuokaに声をかけていただけると嬉しいです!! Fi-VJ(ファイブイジェイ)というVJアプリを極々個人的に制作しました。MacのネイティブアプリでもなければiPhone/iPadアプリでもありません。ブラウザで動くHTML5-VJアプリです。確認済み動作環境はMac版Safari 5.0.5だけです。他のブラウザでは確認してません（デモページはSafariとChromeで動くようですが）。というかローカル実行ではSafari以外ではまず動きません。これに関する解説は後ほど。 ここ数年ビデオミキサーにiPhoneやiPodを繋いでプレイしていた私ですが、そろそろPCを使ったVJに戻ろうかと思ったのがちょうど
HTML5でFlash不要のYouTube作ってみた (1/7)
本記事で作成するサンプル。HTML5 Videoを使ってビデオを再生している。Safariではフルスクリーンモードにも対応 これまでブラウザーでビデオを再生するには、Flash Playerなどのプラグインの力を借りなければなりませんでした。ところが、現在策定が進められている次世代のWeb標準規格「HTML5」では、ブラウザー標準の機能だけで手軽にビデオを再生できます。 「HTML5 Videoって使われているの？」と疑問に思う方もいるかもしれません。実は、動画共有サイトの「YouTube」が、HTML5を使ったビデオプレーヤーを試験的に公開しています。以下のページにアクセスすると、HTML5版のビデオプレーヤーでYouTubeのビデオを閲覧できます。
ニコニコ動画でのHTML5
HTML5 is the Future of Mobile, PhoneGap Takes You There Todaydavyjones
字幕.inみたいなサイトが簡単に作れそうなスマフォ対応のHTML5動画プレイヤー「LeanBack Player」:phpspot開発日誌
LeanBack Player | HTML5 Video Player 字幕.inみたいなサイトが簡単に作れそうなスマフォ対応のHTML5動画プレイヤー「LeanBack Player」。 次のように字幕を付けることができます。埋め込みコードの出力や、Youtubeっぽいインタフェースもいい感じです。 HTML5なのでモバイルデバイスなんかでも使えちゃいますね。 HTML5非対応ブラウザで見ても動画は再生できるようになっています。 独立したライブラリで動作し、CSSによるスキン変更にも対応。 キーボードショートカットにも対応するなど芸が細かい。 PCでは主要ブラウザでの動作が確認されている他、モバイルデバイスでは、iPhone iOS 3+、iPad iOS 3.2+、Android2.2でもテストされています。 関連エントリ HTML5で動画や音声再生を可能にするライブラリ集 CSSで
ASCII.jp：HTML5 videoでニコニコ動画風プレーヤーを作ろう (1/7)
HTML5テロッパーのサンプル。テキストエリアの文字がテロップとして動画の上に表示される画像クリックでサンプルページを表示します（Firefox 3／Opera 10／Safari 4で表示可能） 動画投稿サイト「ニコニコ動画」が人気です。ニコニコ動画はユーザーのコメントを再生中の動画にテロップのように表示する機能が特徴で、多くのユーザーがコメントを書き込んで楽しんでいます。 ニコニコ動画のようにブラウザー上で動画を再生しながらテロップを表示するには、従来、Flashが必要でした。Flash（Action Script）に習熟している開発者でなければ、ニコニコ動画のようなWebサービスは作れなかったのです。ところが現在、モダンブラウザーへの実装が進んでいるHTML5 videoなら、JavaScriptを使って簡単に文字や画像を動画に重ねられます。 今回はHTML5 videoとJavaS
html5で videoの任意のフレームをcanvasに描画するメモ - 超自己満足プログラミング
デブサミ2010のhtml5セッションで見たデモ（Movement tracker）*1 が、 衝撃的だったので video x canvas をちょっと勉強した。 １．videoの任意のフレームをそのままcanvasに描画させてみる htmlのbodyに書くにはこれだけ。 <video id="v" src="video.ogv" autobuffer controls></video> <canvas id="c"></canvas> <input type="button" value="copy frame" onclick="copyFrame()" /> copy frameボタンで呼び出されるjavascriptはこんな感じ。 function copyFrame() { var cEle = document.getElementById('c'); var cCtx =
Webブラウザで動画編集！ - Yanagi Entertainment
html5で videoの任意のフレームをcanvasに描画するメモ - 超自己満足プログラミング http://d.hatena.ne.jp/favril/20100225/1267099197 昨日この記事を見て、これはすごい！ すごいすごい！ ってなって、これができるんならWebブラウザだけで動画編集できるんじゃね？ と思ったりしたので、ざっくり作ってみました。 http://yanagiatool.appspot.com/jsvideo/player.html （MacのSafari4で動作確認。QuickTime + ChromeならWindowsでもいけるかも？） あそびかた 「動画を読み込む」ボタンを押すと、テキストボックスに入ってるurlの動画を読み込みます。「state」って書いてあるところが「stand by」になったら「再生 / 停止」ボタンを押してください。 あとは
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
