2014/07/16
このブログについて > FLV Player で動画埋め込み
このブログについて > FLV Player で動画埋め込み
一昨日から FLV 形式での動画(PC での操作画面)埋め込みを始めた。それに欠かせない Flash の FLV Player についてメモ。まず公式サイトトップ、SWF ファイルのダウンロードページ、およびオンラインドキュメント。機能によって三種類のプレーヤがあり(MINI, NORMAL, MAXI)、ダウンロードとドキュメントも各三つのページがある。
■ FLV Player
http://flv-player.net/
■ FLV Player : Download
http://flv-player.net/players/mini/download/
http://flv-player.net/players/normal/download/
http://flv-player.net/players/maxi/download/
■ FLV Player : Documentation
http://flv-player.net/players/mini/documentation/
http://flv-player.net/players/normal/documentation/
http://flv-player.net/players/maxi/documentation/
このプレーヤの存在と使い方は ↓ で知った。その後バージョンが進んでファイル名等は変わっていたが、基本は同じでとても参考になった。
■ Trivial Weblog : ロゴが入らないフリーのFLV PLAYER
http://www.nrkz.net/2010/01/05/post_338.html
このブログでは当面、最も機能が多い MAXI を使う。↓ から SWF ファイル一つをダウンロードしてブログの適当な所に UP する。
↓ MAXI 版のドキュメント。最初に Example がある。パラメータは object タグ内の <param name="FlashVars" value="〜"> の value 属性内に & で連結して書くらしい。
↓ 適当な動画のサンプル。自分が使っている VJE-Delta + TUT-Code という日本語入力環境(漢字直接入力の一種)のようすを録画したもの。
https://kenpg.up.seesaa.net/image/20140716_tut.flv
上の例で設定したパラメータは次のとおり。
showplayer=always にすると再生領域の高さがコントールの分(20px)だけ狭まるので、option タグの height を 20 足している。
再生時の Tips として、コントロールの時間をクリックすると「再生済み時間」と「残時間」が交互に切り替わる。またシークバーでのクリック or ドラッグで前方・後方へスキップできるが、ウェブ上での再生だから滑らかとは言えず、バッファ絡みか何かで停まる場合もある。ページをリロードすれば、また再生できる状態になる。
■ FLV Player
http://flv-player.net/
■ FLV Player : Download
http://flv-player.net/players/mini/download/
http://flv-player.net/players/normal/download/
http://flv-player.net/players/maxi/download/
■ FLV Player : Documentation
http://flv-player.net/players/mini/documentation/
http://flv-player.net/players/normal/documentation/
http://flv-player.net/players/maxi/documentation/
このプレーヤの存在と使い方は ↓ で知った。その後バージョンが進んでファイル名等は変わっていたが、基本は同じでとても参考になった。
■ Trivial Weblog : ロゴが入らないフリーのFLV PLAYER
http://www.nrkz.net/2010/01/05/post_338.html
このブログでは当面、最も機能が多い MAXI を使う。↓ から SWF ファイル一つをダウンロードしてブログの適当な所に UP する。
↓ MAXI 版のドキュメント。最初に Example がある。パラメータは object タグ内の <param name="FlashVars" value="〜"> の value 属性内に & で連結して書くらしい。
↓ 適当な動画のサンプル。自分が使っている VJE-Delta + TUT-Code という日本語入力環境(漢字直接入力の一種)のようすを録画したもの。
https://kenpg.up.seesaa.net/image/20140716_tut.flv
上の例で設定したパラメータは次のとおり。
flv=(FLV ファイルの URL)
margin=0 … プレーヤを縁なしに
showiconplay=1 … スタート用アイコンを中央に表示
showplayer=always … 動画下部のコントロールを常に表示
showtime=2 … コントロールに残時間を表示
startimage=(再生前に表示される JPEG の URL)
margin=0 … プレーヤを縁なしに
showiconplay=1 … スタート用アイコンを中央に表示
showplayer=always … 動画下部のコントロールを常に表示
showtime=2 … コントロールに残時間を表示
startimage=(再生前に表示される JPEG の URL)
showplayer=always にすると再生領域の高さがコントールの分(20px)だけ狭まるので、option タグの height を 20 足している。
再生時の Tips として、コントロールの時間をクリックすると「再生済み時間」と「残時間」が交互に切り替わる。またシークバーでのクリック or ドラッグで前方・後方へスキップできるが、ウェブ上での再生だから滑らかとは言えず、バッファ絡みか何かで停まる場合もある。ページをリロードすれば、また再生できる状態になる。