米Yahoo! が埋め込み式のメディアプレイヤー Yahoo! WebPlayerを公開しました。かっこ良いのと使い勝手が良さそうだったのとで、いつか使うかもしれないメモ的エントリーです。

このライブラリを使用する事で、mp3へのリンクやYoutube、動画へのリンクがページ内でかっこ良く再生してくれます。

さらにページ内のリンクを自動で拾ってプライリストにしてくれたりもします。

↑再生してみた様子

対応ブラウザにはIE6も含まれているようですね。

使い方

使い方は簡単で、以下のスクリプトタグを</body>の直前に挿入すればOKです。

<script type="text/javascript" 
src="http://webplayer.yahooapis.com/player-beta.js"></script>

お手軽ですね:)
興味のある方は下のリンクからどうぞ〜。

スマフォでの動画再生の際に、キューポイント（再生開始位置）を指定できるライブラリが良さそうなのでメモ的にエントリー。もちもんPCもOKですよ。

「Cuepoint.js」はHTML5のビデオに、
字幕とキューポイントを追加するためのオープンソースのJavaScriptです。

デモサイトを訪れると動画が埋めこまれているのですが、
画面の下にあるサムネイルをクリックすると、
それぞれに対応した箇所から再生が開始されるようになっています。

長い動画を見せたい時に、見て欲しいポイントを分かりやすくできて良いですよね。

とても単純な処理なのですが、何回かお仕事でこういうものを探していたので
そのうち使いそうです。

興味のある方は下のリンクからどうぞ。

「VideoJS」はCSSだけでスキンの変更ができるHTML5のビデオプレイヤーです。

画像を一切に使用していないため、CSSだけでスキンの変更が可能になっています。

「LeanBack Player」は字幕を表示する事ができるオープンソースのVideoプレイヤーです。

「jMediaelement」はHTML5とjQueryで作られたビデオプレイヤーです。

カスタマイズを前程に作られているようで、各ボタンを操作した際のイベントの設定など細かくできるようになっていました。

Youtubeの動画も再生できるようです。

「osmplayer」というオープンソースで作られたメディアプレイヤーをご紹介。

html5の<video>タグを使用すると簡単に動画を埋め込めるようになりますが、対応していないブラウザが多いのも事実です。
今回ご紹介する「html5media」はvideoタグを有効にする事ができるJavaScriptです。

videoタグを使用する事でFlashなどのプラグインが必要なくなり、設置も簡単にできるようになります。

詳しくは以下

Sublime VideoはHTML5で使用できるVideoPlayerです。今までは動画の再生にはFlash Playerなどが必要でしたが、HTML５を使用する事によりFlashに頼らないサイト作りが可能になってきてます。

とはいえ、全ての環境で動くわけではないので注意は必要です。

Sublime Videoは以下の環境で動作するようです。
・Safari (v4.0.4+)
・Google Chrome (v4.0+)
・Internet Explorer with Chrome Frame installed

新しい技術に興味のある方は使ってみてはいかがでしょうか。

■2010/02/02追記
個人利用に限りフリーとなっているようです。利用にはご注意ください。