- - - index.html HTMLsource - - -
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- A minimal Flowplayer setup to get you started -->
<!--
include flowplayer JavaScript file that does
Flash embedding and provides the Flowplayer API.
-->
<SCRIPT type="text/javascript" src="/js/flowplayer-3.0.0-rc2.min.js"></SCRIPT>
<!-- some minimal styling, can be removed -->
<link rel="stylesheet" type="text/css" href="style.css">
<!-- page title -->
<title>Minimal Flowplayer setup</title>
</head>
<body>
- - - - -
<a href="/douga/douga.flv" style="display:block;width:425px;height:320px" id="player">
<IMG src="/img/hoge.jpg" alt="flowplayer3.0" width="425" height="320">
</a>
<SCRIPT language="JavaScript">
$f("player", "/swf/flowplayer-3.0.0-rc2.swf", { clip:
{ url: /douga/douga.flv', autoPlay: true } });
</SCRIPT>
- - - - - -
</body>
</html>
|
flowplayer3.0 Build
【解説】
最新版は、ここからダウンロードできます。
ダウンロードしたflowplayer-3.0.0-rc2.zip を解凍。
( いつのまにか、rc1が、flowplayer-3.0.0-rc3.zip になっていた。
すさまじい早さでバージョンUPしている。追いつきません。 )
落ち着いてきたら、また次の最新版を検証してみる事にします。
以下は、flowplayer-3.0.0-rc2.zip を検証したもの。
exampleフォルダの中にある index.html ソースから、
緑色と黄色部分のsourceを 自前の html に書き出す。
今回は、黄色部分のように、初期画面の画像を挿入する設定と
flv動画の場所を指定してカスタマイズします。
次に、
ファイルパスと動画の幅と高さを環境に合わせて書き換える。
同梱されている
flowplayer-3.0.0-rc2.min.js
flowplayer-3.0.0-rc2.swf
flowplayer.controls-3.0.0-beta5.swf ← これがないと動かない
hoge.jpg douga.flv ← 用意した初期画像とflv 動画ファイル
自前の HTML
以上をサーバにアップロードする。
アクセスしてみる。 OK?
出来ない時は、ファイルのパスを見直してみて下さい。
初期画面 hoge.jpg は、なくてもいいと思います。
これで、出来上がりです。
good luck !!
管理人
|