简单酷炫的网页视频播放器
- WBOY原創
- 2016-06-07 11:39:041352瀏覽
Flowplayer是一款免费的WEB视频播放器。它支持播放flv、swf等流媒体和图片文件，能够非常流畅的播放视频文件，支持自定义配置和扩展。
页面底部有演示、免费下载链接。若是想看更多js特效、网站源码、 js教程请访问 http://www.sucaihuo.com/js 还有演示DEMO，最主要是可以免费下载。1、引入Flowplayer插件。<br>
<script></script><br>
<br>
2、然后我们加入两个演示demo。第一个默认设置，第二个自定义。<br>
<div> <br>
<a></a> <br>
</div> <br>
<br>
<div></div>
<br>
<br>
调用flowplayer播放视频方法：<br>
flowplayer("player", "flowplayer.swf"); <br>
flowplayer("player2", "flowplayer.swf", { <br>
clip: { <br>
url: "demo.flv",//视频文件地址 <br>
autoPlay: false,//是否自动播放 <br>
autoBuffering: true //是否自动缓冲，即当视频文件设置为不自动播放时，播放器仍然预先下载视频文件内容 <br>
} <br>
});<br>
flowplayer还支持播放列表，以及皮肤设置等多项高级设置，更多配置方法如下，感兴趣的可以自己尝试做起来。<br>
flowplayer（"player"，"flowplayer.swf"， { //播放器主文件（按照项目定亦可引用：http://releases.flowplayer.org/swf/flowplayer-3.2.12.swf） <br>
clip: { <br>
<br>
autoPlay: true， //主动播放 <br>
autoBuffering: true //是否开启缓冲 <br>
}， <br>
<br>
playlist: [ //播放列表 <br>
{ <br>
<br>
url: "notfound.jpg"， //默认显示图片（若是没有这显示播放视频的第一个画面） <br>
//duration: 5，//延迟时间 <br>
scaling: "orig" //缩放 <br>
}， <br>
<br>
{ <br>
<br>
url: "demo.flv"， //须要播放的文件 <br>
autoPlay: false， <br>
<br>
provider: "http"， <br>
<br>
autoBuffering: true <br>
<br>
} <br>
<br>
]， <br>
<br>
plugins: { <br>
<br>
controls: { <br>
<br>
bottom: 0， //功能条距底部的间隔 <br>
height: 24， //功能条高度 <br>
zIndex: 1， <br>
<br>
fontColor: "＃ffffff"， <br>
<br>
timeFontColor: "＃333333"， <br>
<br>
playlist: true， //上一个、下一个按钮 <br>
play: true， //开端按钮 <br>
volume: true， //音量按钮 <br>
mute: true， //静音按钮 <br>
stop: true， //停止按钮 <br>
fullscreen: true， //全屏按钮 <br>
scrubber: true， //进度条 <br>
url: "flowplayer.controls-3.2.12.swf"， //决意功能条的显示样式（功能条swf文件，按照项目定亦可引用:http://releases.flowplayer.org/swf/flowplayer.controls-3.2.12.swf） <br>
time: true， //是否显示时候信息 <br>
autoHide: true， //功能条是否主动隐蔽 <br>
backgroundColor: "＃aedaff"， //靠山色彩 <br>
backgroundGradient: [0.1，0.1，1.0]， //靠山色彩渐变度（等分的点渐变） <br>
opacity: 0.5， //功能条的透明度 <br>
borderRadius: "30"， //功能条边角 <br>
tooltips: { <br>
<br>
buttons: true， //是否显示 <br>
fullscreen: "全屏"， //全屏按钮，鼠标指上时显示的文本 <br>
stop: "停止"， <br>
<br>
play: "开端"， <br>
<br>
volume: "音量"， <br>
<br>
mute: "静音"， <br>
<br>
next: "下一个"， <br>
<br>
previous: "上一个" <br>
<br>
} <br>
<br>
} <br>
<br>
} <br>
<br>
}）;查看该特效演示及免费下载，请访问http://www.sucaihuo.com/js/44.html
AD：真正免费，域名+虚机+企业邮箱=0元