flowplayer网页视频播放器事例详解--包含各种参数说明(自译)
<html xmlns= "http://www.w3.org/1999/xhtml" > <head runat= "server" > <title></title> <meta http-equiv= "content-type" content= "text/html; charset=UTF-8" /> <script type= "text/javascript" src= "flowplayer-3.2.11.min.js" ></script> <link rel= "stylesheet" type= "text/css" href= "style.css" /> </head> <body> <form id= "form1" runat= "server" > <%--<div> //简单调用 <a href= "flowplayer-700.flv" style= "display:block;width:520px;height:330px" id= "player" > </a> <script> flowplayer( "player" , "flowplayer-3.2.12.swf" , { clip: { autoPlay: false , autoBuffering: true } }); </script> </div>--%> <div> <a href= "flowplayer-700.flv" style= "display: block; width: 520px; height: 330px" id= "player" ></a> <script> flowplayer( "player" , "flowplayer-3.2.12.swf" , { //播放器主文件(根据项目定亦可引用:http://releases.flowplayer.org/swf/flowplayer-3.2.12.swf) clip: { autoPlay: true , //自动播放 autoBuffering: true //是否开启缓冲 }, playlist: [ //播放列表 { url: "notfound.jpg" , //默认显示图片(如果没有这显示播放视频的第一个画面) //duration: 5,//持续时间 scaling: 'orig' //缩放 }, { url: 'flowplayer-700.flv' , //需要播放的文件 autoPlay: false , provider: 'http' , autoBuffering: true } ], plugins: { controls: { bottom: 0, //功能条距底部的距离 height: 24, //功能条高度 zIndex: 1, fontColor: '#ffffff' , timeFontColor: '#333333' , playlist: true , //上一个、下一个按钮 play: true , //开始按钮 volume: true , //音量按钮 mute: true , //静音按钮 stop: true , //停止按钮 fullscreen: true , //全屏按钮 scrubber: true , //进度条 url: "flowplayer.controls-3.2.12.swf" , //决定功能条的显示样式(功能条swf文件,根据项目定亦可引用:http://releases.flowplayer.org/swf/flowplayer.controls-3.2.12.swf) time: true , //是否显示时间信息 autoHide: true , //功能条是否自动隐藏 backgroundColor: '#aedaff' , //背景颜色 backgroundGradient: [0.1, 0.1, 1.0], //背景颜色渐变度(等分的点渐变) opacity: 0.5, //功能条的透明度 borderRadius: '30' , //功能条边角 tooltips: { buttons: true , //是否显示 fullscreen: '全屏' , //全屏按钮,鼠标指上时显示的文本 stop: '停止' , play: '开始' , volume: '音量' , mute: '静音' , next: '下一个' , previous: '上一个' } } } }); </script> </div> </form> </body> </html> |
播放器外观样式定制页面:http://flowplayer.org/documentation/skinning/controlbar.html