CkplayerX3如何整合苹果全新MacCMSPro版
本帖最后由 595426 于 2022-5-17 11:25 编辑全新MacCMSPro版,苹果CMSpro如何整合CkplayerX3,使其正常使用
ckplayer.htmlckplayer.js 本地化无法正常使用,在线求答,代码如下请指正
ckplayer.html代码如下
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CKplayerX3播放器</title>
<link type="text/css" rel="stylesheet" href="static/player/ckplayer/css/ckplayer.css" />
<script type="text/javascript" src="static/player/ckplayer/hls.js/hls.min.js"></script>
<script type="text/javascript" charset="utf-8" src="static/player/ckplayer/language/zh.cn.js"></script>
<script type="text/javascript" charset="UTF-8" src="static/player/ckplayer/js/ckplayer.js"></script>
<style type="text/css">
body,html{height:100%;background-color:#000;margin:0px;padding:0px;overflow:hidden;}
#rongyao{height:100%;}
</style>
</head>
<body>
<div id="video"></div>
<script type="text/javascript">
function getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars.split("=");
if (pair == variable) {
return pair;
}
}
return (false);
};
var videoObject = {
container: '#video', //容器的ID或className
autoplay: true, //自动播放
loaded: 'loadedHandler',
screenshot:true,//截图功能是否开启
plug:'hls.js',//使用插件
rightBar:true,//是否开启右边控制栏
smallWindows:true,//是否启用小窗口模式
playbackrateOpen:true,//是否开启控制栏倍速选项
webFull:true,//是否启用页面全屏按钮,默认不启用
theatre:true,//是否启用剧场模式按钮,默认不启用
video: getQueryVariable("url") //播放地址
};
var player=new ckplayer(videoObject);
</script>
</body>
</html>
ckplayer.js代码如下
MacPlayer.Html = '<iframe border="0" src="'+maccms.path+'/static/player/ckplayer.html" height=\"'+MacPlayer.Height+'\" width=\"100%\" marginWidth=\"0" \ frameSpacing=\"0"\ marginHeight=\"0"\ frameBorder=\"0"\ scrolling=\"no"\ vspale=\"0"\ id=\"Player\" allowfullscreen=\"true\" ><\/iframe>';MacPlayer.Show();
本帖最后由 mshuking 于 2022-5-20 09:53 编辑
很明显html没有引用苹果视频标签 video:苹果视频地址parent.MacPlayer.PlayUrl; 更新代码如下
或js加个苹果视频标签也是可以的ckplayer.html?url=苹果视频地址 ckplayer.html?url=parent.MacPlayer.PlayUrl;
html代码
<!DOCTYPE html>
<html>
<head>
<title>ckplayerx3播放器</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=11" />
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport">
<style type="text/css">
html,body{width:100%;height:100%; padding:0; margin:0;}
#playerCnt{width:100%;height:100%;position: relative;}
</style>
<link rel="stylesheet" type="text/css" href="ckplayerx3/css/ckplayer.css">
<script type="text/javascript" charset="utf-8" src="ckplayerx3/js/ckplayer.js"></script>
<script type="text/javascript" charset="utf-8" src="ckplayerx3/flv.js/flv.js"></script>
<script type="text/javascript" charset="utf-8" src="ckplayerx3/hls.js/hls.js"></script>
<script type="text/javascript" charset="utf-8" src="ckplayerx3/mpegts.js/mpegts.js"></script>
</head>
<body marginwidth="0" marginheight="0">
<div id="playerCnt" class="playerCnt"></div>
<script type="text/javascript">
var plug="normal";
var live=false;
var url=parent.MacPlayer.PlayUrl;
var urlhz=url.split(".").pop().toLowerCase();
if(urlhz="m3u8"){plug="hls.js";}else if(urlhz="flv"){plug="flv.js";}else if(urlhz="ts"){plug="mpegts.js";}else if(urlhz="mp4"){plug="";}else{plug="";}
var videoObject = {
container:".playerCnt", //容器的ID或className
autoplay:false, //是否自动播放
rightBar:true,
screenshot:true,
smallWindows:true,
playbackrateOpen:true,
webFull:true,
plug:plug,
live:live,
next:{
link:parent.MacPlayer.PlayLinkNext,
content:".video-next"
},
menu:[
{
title:"ckplayer",
link:"http://www.ckplayer.com"
},
{
title:"version:X3",
underline:true
},
{
title:"关于视频",
click:"aboutShow"
}
],
information:{
"视频加载:":"{loadTime}秒",
"视频时长:":"{duration}秒",
"视频尺寸:":"{videoWidth}x{videoHeight}",
"视频音量:":"{volume}%",
"视频FPS:":"{fps}",
"音频解码:":"{audioDecodedByteCount} Byte",
"视频解码:":"{videoDecodedByteCount} Byte"
},
video:url
};
var player=new ckplayer(videoObject)
</script>
</body>
</html>
感谢@mshuking,已完美整合
页:
[1]