`
gouxychina
  • 浏览: 33205 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

MP4 flash播放器,开放换肤功能,支持iphone/ipad/ipod

阅读更多
最近视频网站竞争比较激烈,相传youku/tudou都已经开始IPO,再加上早有ku6借壳上市,创业版更是出现了乐视这样的成功案例,可谓风生水起,所以特别制作一版开放换肤功能的视频播放器,特别加入了支持iphone/ipad/ipod等苹果设备的解决方案,这下可暂时解决apple与adobe之前的战争引起广大网友的不便。

  小试牛刀,记录一下此视频播放器开放的功能:

1. 支持任意点播放视频,需要服务器端支持?start=xxx这种url格式,不然不能正常使用此功能
2.   支持视频结束相关视频显示,配置文件为:视频文件名_more.xml文件格式
3.   支持进度条区域信息地雷显示提示,配置文件为:视频文件名_infopoint.xml文件格式
4.   支持外挂swf皮肤文件,通过重新修改swf皮肤文件即可换肤
5.   通过js+html5达到支持苹果设备(iphone/ipad/ipod)的播放
6.   其它常用功能不再一一赘述,希望很快拿来去使用的朋友直接看下面示例

测试地址:http://www.gouxy.com/

说明:
首先,利用html5代码,来支持苹果设备的safari浏览器,代码如下:
<video id='videoIpad' controls='controls' autoplay='autoplay' width='482' height='390' />

其次,通过js检测支持的设备是否为苹果设备,代码如下:
var testAppleMobile = /\((iPhone|iPad|iPod)/i;
if(!testAppleMobile.test(navigator.userAgent)){
//如果没有匹配中苹果设备可以调用flash播放器支持

}

最后通过swf?flv=xxx.flv或者swf?mp4=xxx.mp4这样的方法来传递视频地址,播放器就会很好的播放了

关于相关视频显示:(视频名_more.xml)
http://www.gouxy.com/waka_more.xml
<?xml version="1.0" encoding="utf-8"?>
<info>
<myitem>
   <src>http://img.v48.56.com/images/4/24/zhibo8cni56olo56i56.com_127966760756hd.jpg</src>
   <title>上面是本视频图片,此处可不用填写</title>
   <url>http://www.hexun.com</url>
</myitem>
<item>
   <src>http://img.v197.56.com/images/14/7/zhibo8cni56olo56i56.com_127976067295hd.jpg</src>
   <title>北京国安2队新加坡引发群殴 50人大乱斗多人挂彩</title>
   <url>http://www.sohu.com</url>
</item>
<item>
   <src>http://img.v48.56.com/images/25/18/basailuona2i56olo56i56.com_128031171927hd.jpg</src>
   <title>菲警方首度承认警察可能开枪射杀香港游客</title>
   <url>http://www.sina.com</url>
</item>
</info>

关于信息地雷提示(视频名_infopoint.xml):
http://www.gouxy.com/waka_infopoint.xml
<?xml version="1.0" encoding="utf-8"?>
<info>
<item>
   <title>大家好这是标题1111!!</title>
   <t>3:51</t>
</item>
<item>
   <title>大家好这是标题2222!!</title>
   <t>8:51</t>
</item>
<item>
   <title>大家好这是标题3333!!</title>
   <t>9:56</t>
</item>
</info>

关于换肤:
http://www.gouxy.com/skin/SkinOpen.fla(可修改此文件达到目的)
http://www.gouxy.com/skin/SkinOpen.as(这是一个为fla准备的配置文件,可以调配一些简单的配置)


SkinOpen.as的主要内容:
//设置视频显示坐标x,y相对于舞台
    conf["videobox"]={x:2,y:3};
    //x控制面板相对于舞台 h控制台高度
    conf["control"]={x:2,h:41};
    //时间面板显示的时间颜色
    conf["timepanel"]={textcolor:"0x656565"};
    //x,y相对于控制面板背景
    conf["progress"]={x:5,y:5};
    //v音量大小百分比
    conf["setpanel"]={v:0.5};  
    //setcolorduration色彩饱和度值,一般不做修改
    conf["other"]={setcolorduration:200};
    //播放器所在路径用于复制flash链接
    conf["flashurl"]={url:"http://www.gouxy.com/main.swf"};
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics