Pop:经常有设计网页的朋友现在肯定为多平台的兼容代码而头痛,特别是多媒体的代码,如视频、音乐的控制,往往在电脑的IE、Chrome等都可以,但是到了手机上如微信、UC上就不行了。
这里给大家分享一个可以用于多平台的网页视频播放器源码:CuPlayer 酷播播放器
CuPlayer效果如下:
CuPlayer源码调用代码:
可适配pc终端、苹果终端(含IPHONE、IPAD)、安卓终端(含安卓系统手机和安卓系统平板)
例1:适配移动终端演示写法示例
本示例采用的是http协议,用一个mp4文件来适配PC,安卓android系统,苹果IOS系统:
<!--播放器/代码开始-->
<div class="video" id="CuPlayer" style="background:#000000; width:650px;">
<SCRIPT LANGUAGE=JavaScript>
<!--
var vID = "";
var vWidth = 650;
var vHeight = 400;
var vFile = "CuSunV2set.xml";
var vPlayer = "player.swf?v=2.5";
var vMp4url = "http://demo.cuplayer.com/file/test.mp4";
var vPic = "images/startpic.jpg";
//-->
</SCRIPT>
<script class="CuPlayerVideo" data-mce-role="CuPlayerVideo" type="text/javascript" src="Images/AsComV3.js"></script>
</div>
<!--播放器/代码结束-->
例2:适配移动终端,采用HLS的写法示例
本示例采用的是http协议+rtmp协议,采用了HLS的视频流,实现跨平台,适配PC,安卓android系统,苹果IOS系统:
<!--播放器/代码开始-->
<div class="video" id="CuPlayer" style="background:#000000; width:650px;">
<SCRIPT LANGUAGE=JavaScript>
<!--
var vID = "";
var vWidth = 650;
var vHeight = 400;
var vFile = "CuSunV2set.xml";
var vPlayer = "player.swf?v=2.5";
var vPic = "images/startpic.jpg";
//PC,安卓
var vServer = "rtmp://www.cuplayer.com/live";
var vMp4url = "livestream";
//iOS
var vIosurl = "http://www.cuplayer.com:8080/liveevent/livestream.m3u8";
//-->
</SCRIPT>
><script class="CuPlayerVideo" data-mce-role="CuPlayerVideo" type="text/javascript" src="Images/AsComV5.js"> </script> </div>
<SCRIPT language=javascript src="Images/jquery.js" type=text/javascript> </SCRIPT>
<SCRIPT language=javascript src="Images/action.js" type=text/javascript> </SCRIPT>
<!--播放器/代码结束-->
CuPlayer源码下载地址:
http://www.cuplayer.com/CuSunPlayer/playerFor_PC_IPAD_Android.rar
CuPlayer官方网站:
http://www.cuplayer.com/player/PlayerCodeCourse/2014/03301258.html