flowplayer

# 首先在Flowplayer的下載頁面下載Flowplayer的安裝包。Flowplayer是一款開源軟件，在該頁面你同時可以下載到源代碼。另外，Flowplayer提供了免費版本及商業版本，它們在功能上是完全一致的，唯一區別是免費版本在視頻封面上有Flowplayer的水印logo，商業版本沒有或可添加你自己的logo。

下載安裝包解壓後可以找到以下幾個主要文件：

    * flowplayer-3.1.1.swf：用於播放器主體的flash文件
    * flowplayer.controls-3.1.1.swf：控制條文件，是個可選的插件
    * flowplayer-3.1.1.min.js：播放器的api文件，也用來裝載整個播放器
    * index.html：一個簡單的可運行示例

# 在頁面調用播放器前引入播放器的api腳本文件flowplayer-3.1.1.min.js，如下：

<script src="path/to/the/flowplayer-3.1.1.min.js"></script>

# 通過一個鏈接(<a>標籤)指向視頻文件的鏈接，並設定視頻文件長寬，同時應爲它指定一個id。該鏈接的位置即是視頻顯示的位置。如下：

<a 
    href="http://www.mywebsite.com/myVideo.flv" 
    style="display:block;width:425px;height:300px;" 
    id="player">
</a>

# 調用api爲上一步設定的鏈接位置裝載播放器，如下：

flowplayer("player", "path/to/the/flowplayer-3.1.1.swf");

上面代碼中第一個參數是上一步中設定的鏈接id，第二個參數是播放器主體的flash文件路徑。使用flowplayer()方法裝載播放器時，可以指定非常多的參數來配置或個性化你的播放器。常用的例如：

<mce:script type="text/javascript"><!-- flowplayer("player", "flowplayer.swf", { clip: { autoPlay: false, //是否自動播放，默認true autoBuffering: true //是否自動緩衝視頻，默認true } onLoad: function() { // 當播放器載入完成時調用 this.setVolume(30); // 設置音量0-100，默認50 } }); // --></mce:script>

還有非常多的參數可供配置，感興趣的話參考官方站提供的文檔頁面

下面這個flowplayer的宣傳片就是通過上面幾個步驟完成的