- - - 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は、
ここから、ダウンロードできます。
若しくは、ここから。
ダウンロードしたflowplayer-3.0.0-rc2.zip を解凍。
(flowplayer-3.0は、すさまじい早さでバージョン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?
出来ない時は、ファイルのパスを見直してみて下さい。
前バージョン FlowPlayer-2.2.4 Build のページを先に見た方が、
わかりやすいかも知れません。
※上記の記載は、あくまでも個人的な記録です。
参考程度でご覧ください。すべて自己責任で行うことが、お約束。
good luck !!
管理人
|