flowPlayer播放flv视频基本设置

最新推荐文章于 2021-06-23 07:45:08 发布

张东敬

最新推荐文章于 2021-06-23 07:45:08 发布

阅读量4.4k

点赞数

分类专栏： flowPlayer

本文链接：https://blog.csdn.net/biboqingtian/article/details/17259555

版权

flowPlayer 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

flowplayer 版本： flowplayer-3.2.16

首先官网下载（网址：http://flash.flowplayer.org/download/）

1. 解压后，可以先看一下example文件夹，里面有一个demo。

修改index.html

里面的相关属性可以在官网查询到，http://flash.flowplayer.org/documentation/configuration/plugins.html, 大家可以详细的看看，在这里只是简单介绍：

里面的相关swf文件可以在官网下载：

http://releases.flowplayer.org/swf/  加上文件名，例如：http://releases.flowplayer.org/swf/flowplayer.commercial-3.2.16.swf

先附带代码，只是一个小例子：

<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">



<script type="text/javascript" src="../flowplayer-3.2.12.min.js"></script>


<link rel="stylesheet" type="text/css" href="style.css">


<title>Minimal Flowplayer setup</title>

</head><body>
<div id="page">

<div id="player" style="display:block;width:520px;height:330px""> </div>


<script>
flowplayer("player", "../flowplayer.commercial-3.2.16.swf",{
logo: { //公司logo
url: 'logo.jpg',
top: 20,
right: 5,
opacity: 1.0,

// you can supply a relative size
// (to make the logo larger in fullscreen)
width: '10%',
height: '10%',

// if set to false, then the logo is also shown in non-fullscreen mode
fullscreenOnly: false,

// time to display logo (in seconds). 0 = show forever
displayTime: 0,

// if displayTime > 0 then this specifies the time it will take
// for the logo to fade out. this happens internally by changing
// the opacity property from its initial value to full
// transparency. value is given in milliseconds.

// for commercial versions you can specify where the user is
// redirected when the logo is clicked
},
clip: { //播放属性
scaling: 'fit',
bufferLength:5,
live:true,
autoPlay: true,
autoBuffering: true,
url: '', //视频地址，自己找

},
play:{ //暂停图品
url:'showme.png',
width:35,
height:30,
},
canvas: {
backgroundGradient: 'none',
},
plugins: {
controls: { //视频控制栏
url: '../flowplayer.controls-3.2.15.swf',
// display properties
bottom:0,
height:24,
zIndex:1,
backgroundColor: '#2d3e46',
backgroundGradient: 'low',

// controlbar-specific configuration
fontColor: '#ffffff',
timeFontColor: '#333333',

// which buttons are visible and which are not?
play:true,
volume:false,
mute:false,
time:false,
stop:false,
fullscreen:true,

// scrubber is a well-known nickname for the timeline/playhead
// combination
scrubber: true,
tooltips: {
buttons: true,
fullscreen: 'Enter fullscreen mode',
},
},
myContent: { //在播放器添加文字等信息
url: '../flowplayer.content-3.2.8.swf',
opacity:0.8,
bottom:'10%',
right: '25%',
width: '30%',
height:'10%',
border:'none',
textAlign:'right',
backgroundColor: 'transparent',
backgroundGradient: 'none',
border: 0,
style: {
'.title': {
fontSize: 10,
fontFamily: 'verdana,arial,helvetica',
color:'#ffffff',
}
},
html: '<p class="title">dasdasdas</p>',
},
},

});
</script>
</div>

</body></html>