embedv.php_微信开发在线点播电影网ckplayer播放器实例介绍
我們節課程就要開始寫一個小項目了，這項目主要是寫一個在線點播電影影網的，我們用到的播放器是ckplayer
ckplayer基本介紹：
ckplayer的全稱是：超酷flv播放器，他是一款用于網頁上播放視頻的軟件支持的格式如下：
自己需要制作出播放器風格具體的各個按鈕的位置和底部背景的設置在ckplayer/ckplayer.js里面進行設置。
現在地址在他們官網上下載即可，http://www.ckplayer.com/bbs/forum.php?mod=viewthread&tid=10864
將里面的文件進行解壓即可：
打開后解壓到環境中打開即可，但是發現里面一大堆的東西有點影響市容，所以修改一下index.htm文件即可：
奪命雷公狗電影點播系統body,td,th {
font-size: 14px;
line-height: 26px;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
p {
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding-left: 10px;
}
#a1{
/*播放器大小的設置*/
position:relative;
z-index: 100;
width:900px;
height:600px;
float: left;
}
//如果你不需要某項設置，可以直接刪除，注意var flashvars的最后一個值后面不能有逗號
// function loadedHandler(){
// if(CKobject.getObjectById('ckplayer_a1').getType()){//說明使用html5播放器
// alert('播放器已加載，調用的是HTML5播放模塊');
// }
// else{
// alert('播放器已加載，調用的是Flash播放模塊');
// }
// }
var _nn=0;
function ckplayer_status(str){
_nn+=1;
if(_nn>100){
_nn=0;
document.getElementById('statusvalue').value='';
}
document.getElementById('statusvalue').value=str+'\n'+document.getElementById('statusvalue').value;
}
var flashvars={
f:'http://weixin.showtp.com/ckplayer/test.flv',//視頻地址
a:'',//調用時的參數，只有當s>0的時候有效
s:'0',//調用方式，0=普通方法(f=視頻地址)，1=網址形式,2=xml形式，3=swf形式(s>0時f=網址，配合a來完成對地址的組裝)
c:'0',//是否讀取文本配置,0不是，1是
x:'',//調用配置文件路徑，只有在c=1時使用。默認為空調用的是ckplayer.xml
i:'http://www.ckplayer.com/images/loadimg3.jpg',//初始圖片地址
d:'http://www.ckplayer.com/down/pause6.1_1.swf|http://www.ckplayer.com/down/pause6.1_2.swf',//暫停時播放的廣告，swf/圖片,多個用豎線隔開，圖片要加鏈接地址，沒有的時候留空就行
u:'',//暫停時如果是圖片的話，加個鏈接地址
l:'http://www.ckplayer.com/down/adv6.1_1.swf|http://www.ckplayer.com/down/adv6.1_2.swf',//前置廣告，swf/圖片/視頻，多個用豎線隔開，圖片和視頻要加鏈接地址
r:'',//前置廣告的鏈接地址，多個用豎線隔開，沒有的留空
t:'10|10',//視頻開始前播放swf/圖片時的時間，多個用豎線隔開
y:'',//這里是使用網址形式調用廣告地址時使用，前提是要設置l的值為空
z:'http://www.ckplayer.com/down/buffer.swf',//緩沖廣告，只能放一個，swf格式
e:'3',//視頻結束后的動作，0是調用js函數，1是循環播放，2是暫停播放并且不調用廣告，3是調用視頻推薦列表的插件，4是清除視頻流并調用js功能和1差不多，5是暫停播放并且調用暫停廣告
v:'80',//默認音量，0-100之間
p:'1',//視頻默認0是暫停，1是播放，2是不加載視頻
h:'0',//播放http視頻流時采用何種拖動方法，=0不使用任意拖動，=1是使用按關鍵幀，=2是按時間點，=3是自動判斷按什么(如果視頻格式是.mp4就按關鍵幀，.flv就按關鍵時間)，=4也是自動判斷(只要包含字符mp4就按mp4來，只要包含字符flv就按flv來)
q:'',//視頻流拖動時參考函數，默認是start
m:'',//讓該參數為一個鏈接地址時，單擊播放器將跳轉到該地址
o:'',//當p=2時，可以設置視頻的時間，單位，秒
w:'',//當p=2時，可以設置視頻的總字節數
g:'',//視頻直接g秒開始播放
j:'',//跳過片尾功能，j>0則從播放多少時間后跳到結束，<0則總總時間-該值的絕對值時跳到結束
k:'30|60',//提示點時間，如 30|60鼠標經過進度欄30秒，60秒會提示n指定的相應的文字
n:'這是提示點的功能，如果不需要刪除k和n的值|提示點測試60秒',//提示點文字，跟k配合使用，如 提示點1|提示點2
wh:'',//寬高比，可以自己定義視頻的寬高或寬高比如：wh:'4:3',或wh:'1080:720'
lv:'0',//是否是直播流，=1則鎖定進度欄
loaded:'loadedHandler',//當播放器加載完成后發送該js函數loaded
//調用播放器的所有參數列表結束
//以下為自定義的播放器參數用來在插件里引用的
my_url:encodeURIComponent(window.location.href)//本頁面地址
//調用自定義播放器參數結束
};
var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always'};//這里定義播放器的其它參數如背景色(跟flashvars中的b不同)，是否支持全屏，是否支持交互
var video=['http://weixin.showtp.com/ckplayer/test.flv'];
CKobject.embed('ckplayer/ckplayer.swf','a1','ckplayer_a1','100%','100%',false,flashvars,video,params);
/*
以上代碼演示的兼容flash和html5環境的。如果只調用flash播放器或只調用html5請看其它示例
*/
function videoLoadJs(s){
alert("執行了播放");
}
function playerstop(){
//只有當調用視頻播放器時設置e=0或4時會有效果
alert('播放完成');
}
var _nn=0;//用來計算實時監聽的條數的，超過100條記錄就要刪除，不然會消耗內存
function getstart(){
var a=CKobject.getObjectById('ckplayer_a1').getStatus();
var ss='';
for (var k in a){
ss+=k+":"+a[k]+'\n';
}
alert(ss);
}
function ckadjump(){
alert('這里演示了點擊跳過廣告按鈕后的執行的動作，如果注冊會員可以做成直接跳過的效果。');
}
//開關燈
var box = new LightBox();
function closelights(){//關燈
box.Show();
CKobject._K_('a1').style.width='940px';
CKobject._K_('a1').style.height='550px';
CKobject.getObjectById('ckplayer_a1').width=940;
CKobject.getObjectById('ckplayer_a1').height=550;
}
function openlights(){//開燈
box.Close();
CKobject._K_('a1').style.width='600px';
CKobject._K_('a1').style.height='400px';
CKobject.getObjectById('ckplayer_a1').width=600;
CKobject.getObjectById('ckplayer_a1').height=400;
}
function changePrompt(){
CKobject.getObjectById('ckplayer_a1').promptUnload();//卸載掉目前的
CKobject.getObjectById('ckplayer_a1').changeFlashvars('{k->10|20|30}{n->重設提示點一|重設提示點二|重設提示點三}');
CKobject.getObjectById('ckplayer_a1').promptLoad();//重新加載
}
function addflash(){
if(CKobject.Flash()['f']){
CKobject._K_('a1').innerHTML='';
CKobject.embedSWF('ckplayer/ckplayer.swf','a1','ckplayer_a1','600','400',flashvars,params);
}
else{
alert('該環境中沒有安裝flash插件，無法切換');
}
}
function addhtml5(){
if(CKobject.isHTML5()){
support=['all'];
CKobject._K_('a1').innerHTML='';
CKobject.embedHTML5('a1','ckplayer_a1',600,400,video,flashvars,support);
}
else{
alert('該環境不支持html5，無法切換');
}
}
function addListener(){
if(CKobject.getObjectById('ckplayer_a1').getType()){//說明使用html5播放器
CKobject.getObjectById('ckplayer_a1').addListener('play',playHandler);
}
else{
CKobject.getObjectById('ckplayer_a1').addListener('play','playHandler');
}
}
function playHandler(){
alert('因為注冊了監聽播放，所以彈出此內容，刪除監聽將不再彈出');
}
function removeListener(){//刪除監聽事件
if(CKobject.getObjectById('ckplayer_a1').getType()){//說明使用html5播放器
CKobject.getObjectById('ckplayer_a1').removeListener('play',playHandler);
}
else{
CKobject.getObjectById('ckplayer_a1').removeListener('play','playHandler');
}
}
奪命雷公狗電影點播系統body,td,th {
font-size: 14px;
line-height: 26px;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
p {
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding-left: 10px;
}
#a1{
/*播放器大小的設置*/
position:relative;
z-index: 100;
width:900px;
height:600px;
float: left;
}
//如果你不需要某項設置，可以直接刪除，注意var flashvars的最后一個值后面不能有逗號
// function loadedHandler(){
// if(CKobject.getObjectById('ckplayer_a1').getType()){//說明使用html5播放器
// alert('播放器已加載，調用的是HTML5播放模塊');
// }
// else{
// alert('播放器已加載，調用的是Flash播放模塊');
// }
// }
var _nn=0;
function ckplayer_status(str){
_nn+=1;
if(_nn>100){
_nn=0;
document.getElementById('statusvalue').value='';
}
document.getElementById('statusvalue').value=str+'\n'+document.getElementById('statusvalue').value;
}
var flashvars={
f:'http://weixin.showtp.com/ckplayer/test.flv',//視頻地址
a:'',//調用時的參數，只有當s>0的時候有效
s:'0',//調用方式，0=普通方法(f=視頻地址)，1=網址形式,2=xml形式，3=swf形式(s>0時f=網址，配合a來完成對地址的組裝)
c:'0',//是否讀取文本配置,0不是，1是
x:'',//調用配置文件路徑，只有在c=1時使用。默認為空調用的是ckplayer.xml
i:'http://www.ckplayer.com/images/loadimg3.jpg',//初始圖片地址
d:'http://www.ckplayer.com/down/pause6.1_1.swf|http://www.ckplayer.com/down/pause6.1_2.swf',//暫停時播放的廣告，swf/圖片,多個用豎線隔開，圖片要加鏈接地址，沒有的時候留空就行
u:'',//暫停時如果是圖片的話，加個鏈接地址
l:'http://www.ckplayer.com/down/adv6.1_1.swf|http://www.ckplayer.com/down/adv6.1_2.swf',//前置廣告，swf/圖片/視頻，多個用豎線隔開，圖片和視頻要加鏈接地址
r:'',//前置廣告的鏈接地址，多個用豎線隔開，沒有的留空
t:'10|10',//視頻開始前播放swf/圖片時的時間，多個用豎線隔開
y:'',//這里是使用網址形式調用廣告地址時使用，前提是要設置l的值為空
z:'http://www.ckplayer.com/down/buffer.swf',//緩沖廣告，只能放一個，swf格式
e:'3',//視頻結束后的動作，0是調用js函數，1是循環播放，2是暫停播放并且不調用廣告，3是調用視頻推薦列表的插件，4是清除視頻流并調用js功能和1差不多，5是暫停播放并且調用暫停廣告
v:'80',//默認音量，0-100之間
p:'1',//視頻默認0是暫停，1是播放，2是不加載視頻
h:'0',//播放http視頻流時采用何種拖動方法，=0不使用任意拖動，=1是使用按關鍵幀，=2是按時間點，=3是自動判斷按什么(如果視頻格式是.mp4就按關鍵幀，.flv就按關鍵時間)，=4也是自動判斷(只要包含字符mp4就按mp4來，只要包含字符flv就按flv來)
q:'',//視頻流拖動時參考函數，默認是start
m:'',//讓該參數為一個鏈接地址時，單擊播放器將跳轉到該地址
o:'',//當p=2時，可以設置視頻的時間，單位，秒
w:'',//當p=2時，可以設置視頻的總字節數
g:'',//視頻直接g秒開始播放
j:'',//跳過片尾功能，j>0則從播放多少時間后跳到結束，<0則總總時間-該值的絕對值時跳到結束
k:'30|60',//提示點時間，如 30|60鼠標經過進度欄30秒，60秒會提示n指定的相應的文字
n:'這是提示點的功能，如果不需要刪除k和n的值|提示點測試60秒',//提示點文字，跟k配合使用，如 提示點1|提示點2
wh:'',//寬高比，可以自己定義視頻的寬高或寬高比如：wh:'4:3',或wh:'1080:720'
lv:'0',//是否是直播流，=1則鎖定進度欄
loaded:'loadedHandler',//當播放器加載完成后發送該js函數loaded
//調用播放器的所有參數列表結束
//以下為自定義的播放器參數用來在插件里引用的
my_url:encodeURIComponent(window.location.href)//本頁面地址
//調用自定義播放器參數結束
};
var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always'};//這里定義播放器的其它參數如背景色(跟flashvars中的b不同)，是否支持全屏，是否支持交互
var video=['http://weixin.showtp.com/ckplayer/test.flv'];
CKobject.embed('ckplayer/ckplayer.swf','a1','ckplayer_a1','100%','100%',false,flashvars,video,params);
/*
以上代碼演示的兼容flash和html5環境的。如果只調用flash播放器或只調用html5請看其它示例
*/
function videoLoadJs(s){
alert("執行了播放");
}
function playerstop(){
//只有當調用視頻播放器時設置e=0或4時會有效果
alert('播放完成');
}
var _nn=0;//用來計算實時監聽的條數的，超過100條記錄就要刪除，不然會消耗內存
function getstart(){
var a=CKobject.getObjectById('ckplayer_a1').getStatus();
var ss='';
for (var k in a){
ss+=k+":"+a[k]+'\n';
}
alert(ss);
}
function ckadjump(){
alert('這里演示了點擊跳過廣告按鈕后的執行的動作，如果注冊會員可以做成直接跳過的效果。');
}
//開關燈
var box = new LightBox();
function closelights(){//關燈
box.Show();
CKobject._K_('a1').style.width='940px';
CKobject._K_('a1').style.height='550px';
CKobject.getObjectById('ckplayer_a1').width=940;
CKobject.getObjectById('ckplayer_a1').height=550;
}
function openlights(){//開燈
box.Close();
CKobject._K_('a1').style.width='600px';
CKobject._K_('a1').style.height='400px';
CKobject.getObjectById('ckplayer_a1').width=600;
CKobject.getObjectById('ckplayer_a1').height=400;
}
function changePrompt(){
CKobject.getObjectById('ckplayer_a1').promptUnload();//卸載掉目前的
CKobject.getObjectById('ckplayer_a1').changeFlashvars('{k->10|20|30}{n->重設提示點一|重設提示點二|重設提示點三}');
CKobject.getObjectById('ckplayer_a1').promptLoad();//重新加載
}
function addflash(){
if(CKobject.Flash()['f']){
CKobject._K_('a1').innerHTML='';
CKobject.embedSWF('ckplayer/ckplayer.swf','a1','ckplayer_a1','600','400',flashvars,params);
}
else{
alert('該環境中沒有安裝flash插件，無法切換');
}
}
function addhtml5(){
if(CKobject.isHTML5()){
support=['all'];
CKobject._K_('a1').innerHTML='';
CKobject.embedHTML5('a1','ckplayer_a1',600,400,video,flashvars,support);
}
else{
alert('該環境不支持html5，無法切換');
}
}
function addListener(){
if(CKobject.getObjectById('ckplayer_a1').getType()){//說明使用html5播放器
CKobject.getObjectById('ckplayer_a1').addListener('play',playHandler);
}
else{
CKobject.getObjectById('ckplayer_a1').addListener('play','playHandler');
}
}
function playHandler(){
alert('因為注冊了監聽播放，所以彈出此內容，刪除監聽將不再彈出');
}
function removeListener(){//刪除監聽事件
if(CKobject.getObjectById('ckplayer_a1').getType()){//說明使用html5播放器
CKobject.getObjectById('ckplayer_a1').removeListener('play',playHandler);
}
else{
CKobject.getObjectById('ckplayer_a1').removeListener('play','playHandler');
}
}
效果如下所示：
溫馨提示，這里面有兩個地方需要填寫播放地址的
總結
以上是生活随笔為你收集整理的embedv.php_微信开发在线点播电影网ckplayer播放器实例介绍的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： EFM8 USB Library使用笔记
- 下一篇： fcpx插件:stupid raisin