前面幾章講解了使用javascript
從數據源獲取,到使用ffmpeg推流,再到nginx-rtmp發佈流,後端的服務到這裏就已經所有完成了。html5
若是這裏的流程沒走通,那麼這裏的播放器也是沒辦法播放實時流的。java
本章講一下播放器的選用和二次開發,前端的播放器雖然有flex(flash)能夠用,可是很遺憾flex接觸的並很少,學習成本又過高,那麼基於第三方開源的flash播放器二次開發就顯得頗有必要。node
那麼播放器,已經再也不更新的以及收費的,這裏不會進行介紹,只介紹兩種輕量級的開源播放器。android
對於HTML5支持很是棒,能夠自動在flash和html5播放器之間進行切換,videoJS能夠兼容到IE8,它提供的界面很是簡潔,須要對界面進行二次開發。ios
點擊下載videojs開發包nginx
這個播放器是國產播放器,功能有不少,只簡單介紹兩個功能,(1)提供手動切換html5和flash功能(2)提供了關燈開燈功能。徹底能夠知足國內開發的需求(3)它內置了大量的廣告位,好比片頭廣告,暫停廣告,片尾廣告,緩衝廣告,切點廣告,滾動文字廣告,以及知足權限關閉廣告的功能....秒懂國內看視頻就是廣告比較多。
<script type="text/javascript">videojs.options.flash.swf = "player/video-js.swf";</script>
<!-- data-setup{}能夠控制播放器的一些功能;autoplay:true/false,是否自動播放;preload:auto\none\meta,自動加載\不加載\加載元數據 --> <video id="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" poster="img/eguidlogo.png" width="640" height="360" data-setup='{ "html5" : { "nativeTextTracks" : false } }'> <source src='rtmp://192.168.30.21/live/' type='rtmp/flv' /> </video>
若是播放的是普通視頻,須要修改<source src='視頻地址' type='video/mp4或者video/flv'/>
type裏面放 ‘ video/視頻格式 ’ 便可
//播放器實例 var player = videojs('videoPlayer');
/* * 根據videoJS官方文檔編寫的播放器經常使用操做 */ //獲取當前類型 function getCurrentType(idnex) { return idnex.currentType(); } //獲取當前播放地址 function getCurrentAddr(index) { return index.currentSrc(); } //獲取當前播放時間 function getCurrentTime(index) { return index.currentTime(); } //獲取當前網絡狀態 function networkState(index) { return index.networkState(); } //修改播放地址 function setsrc(index, url, type) { index.src({ type : type, src : url }); } //重載播放器 function reset(index) { index.reset(); index.load(); } //播放 function play(index) { index.play(); } //暫停 function pause(index) { index.pause(); }
//播放器實例 var player = videojs('videoPlayer'); //播放器初始化操做面板清晰度菜單 function playerInitVideo() { $videoPanelMenu = $(".vjs-fullscreen-control"); $videoPanelMenu.before('<div class="vjs-subtitles-button vjs-menu-button vjs-menu-button-popup vjs-control vjs-button" tabindex="0" role="menuitem" aria-live="polite" aria-expanded="false" aria-haspopup="true">' + '<div class="vjs-menu" role="presentation">' + '<ul class="vjs-menu-content" role="menu">' + '<li class="vjs-menu-item" tabindex="-1" role="menuitemcheckbox" onclick="changeUrl(this)">高清</li>' + '<li class="vjs-menu-item vjs-selected" tabindex="-1" role="menuitemcheckbox" onclick="changeUrl(this)">標清 </li>' + '</ul></div><span class="vjs-control-text">清晰度</span></div>'); } //加載頁面進行播放器初始化 player.ready(function() { playerInitVideo(); //player.play(); //setsrc(player,"rtmp://192.168.30.21/live/test3","rtmp/flv"); }); //經過id獲取DOM function get(index) { return document.getElementById(index); } //修改播放地址並播放 function writeAddressAndPlay(index,url,type) { //播放器操做 setsrc(index, url, type?type:"rtmp/flv"); play(index); } //高清標清切換就是應用名加減HD function changeUrl(video) { var index = $(video).text(); //獲取當前播放的url var CurrentUrl = getCurrentAddr(player); $(".vjs-menu-item").removeClass("vjs-selected"); $(video).addClass("vjs-selected"); if (index == "高清") { if (CurrentUrl.indexOf("HD") == -1) { CurrentUrl = CurrentUrl + "HD"; } else { return; } } else { if (CurrentUrl.indexOf("HD") != -1) { CurrentUrl = CurrentUrl.replace("HD", ""); } else { return; } } //修改地址並播放 writeAddressAndPlay(player, CurrentUrl); }這只是一種方案,若是有更好的方案,能夠採用其餘方法。
我這裏的兩個實時流採用nginx流媒體服務器推送的兩個實時流的方式(一個普清,一個高清),在命名方式上採用相似增減HD的方式控制,到這裏就能夠自由控制清晰度了
<script type="text/javascript"> //若是你不須要某項設置,能夠直接刪除,注意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://192.168.30.21/test1HD.video.flv',//視頻地址 a:'',//調用時的參數,只有當s>0的時候有效 s:'0',//調用方式,0=普通方法(f=視頻地址),1=網址形式,2=xml形式,3=swf形式(s>0時f=網址,配合a來完成對地址的組裝) c:'1',//是否讀取文本配置,0不是,1是 x:'',//調用配置文件路徑,只有在c=1時使用。默認爲空調用的是ckplayer.xml i:'',//初始圖片地址 d:'',//暫停時播放的廣告,swf/圖片,多個用豎線隔開,圖片要加連接地址,沒有的時候留空就行 u:'',//暫停時若是是圖片的話,加個連接地址 l:'',//前置廣告,swf/圖片/視頻,多個用豎線隔開,圖片和視頻要加連接地址 r:'',//前置廣告的連接地址,多個用豎線隔開,沒有的留空 t:'0|0',//視頻開始前播放swf/圖片時的時間,多個用豎線隔開 y:'',//這裏是使用網址形式調用廣告地址時使用,前提是要設置l的值爲空 z:'',//緩衝廣告,只能放一個,swf格式 e:'2',//視頻結束後的動做,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秒會提示n指定的相應的文字 n:'',//提示點文字,跟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://192.168.30.21/test1HD.video.mp4']; CKobject.embed('ckplayer/ckplayer/ckplayer.swf','player1','ckplayer_1','720px','360px',false,flashvars,video,params); </script>
/* ------------------------------------------------------------------------- 說明: 正式使用時能夠把該文件的註釋所有去掉,節省加載時間 ckplayer6.7,有問題請訪問http://www.ckplayer.com 請注意,該文件爲UTF-8編碼,不須要改變編碼便可使用於各類編碼形式的網站內 ------------------------------------------------------------------------- 第一部分,加載插件 如下爲加載的插件部份 插件的設置參數說明: 一、插件名稱 二、水平對齊方式(0左,1中,2右) 三、垂直對齊方式(0上,1中,2下) 四、水平方向位置偏移量 五、垂直方向位置偏移量 六、插件的等級,0=普通圖片插件且跟隨控制欄隱藏而隱藏,顯示而顯示,1=普通圖片插件且永久顯示,2=swf插件,默認顯示,3=swf插件,默認隱藏,swf插件均可以交互 七、插件是否綁定在控制欄上,0不綁定,1綁定,當值是1的時候該插件將會隨着控制欄一塊兒隱藏或緩動 八、插件爲swf而且可交互時,默認調用的類所在的包名稱,詳細說明能夠到幫助手冊裏查看,默認無 插件名稱不能相同,對此的詳細說明請到網站查看 */ function ckcpt() { var cpt = ''; cpt += 'right.swf,2,1,0,0,2,0|'; //右邊開關燈,調整,分享按鈕的插件 cpt += 'share.swf,1,1,-180,-100,3,0|'; //分享插件 cpt += 'adjustment.swf,1,1,-180,-100,3,0|'; //調整大小和顏色的插件 return cpt; } /* 插件的定義結束 如下是對播放器功能進行配置 */ function ckstyle() { //定義總的風格 var ck = { cpath: '', /* 播放器風格壓縮包文件的路徑,默認的是style.swf 若是調用不出來能夠試着設置成絕對路徑試試 若是不知道路徑而且使用的是默認配置,能夠直接留空,播放器會 */ language: '', /*播放器所使用的語言配置文件,須要和播放器在同目錄下,默認是language.xml*/ flashvars: '', /* 這裏是用來作爲對flashvars值的補充,除了c和x二個參數之外的設置均可以在這裏進行配置 1 1 1 1 1 1 1 1 1 1 2 2 2 2 2 2 2 2 2 2 3 3 3 3 3 3 3 3 3 3 4 4 4 4 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3*/ setup: '1,1,1,1,1,2,0,1,2,0,0,1,200,0,2,1,0,1,1,1,2,10,3,0,1,2,3000,0,0,0,0,1,1,1,1,1,1,250,0,90,0,0,0', /* 這是配置文件裏比較重要的一個參數,共有N個功能控制參數,而且之後會繼續的增長,各控制參數以英文逗號(,)隔開。下面列出各參數的說明: 一、鼠標通過按鈕是否使用手型,0普通鼠標,1手型鼠標,2是隻有按鈕手型,3是控制欄手型 二、是否支持單擊暫停,0不支持,1是支持 三、是否支持雙擊全屏,0不支持,1是支持 四、在播放前置廣告時是否同時加載視頻,0不加載,1加載 五、廣告顯示的參考對象,0是參考視頻區域,1是參考播放器區域 六、廣告大小的調整方式,只針對swf和圖片有效,視頻是自動縮放的 =0是自動調整大小,意思是說大的話就變小,小的話就變大 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟參考對像(第5個控制)參數設置的同樣寬高 七、前置廣告播放順序,0是順序播放,1是隨機播放,>1則隨機取全部廣告中的(N-1)個進行播放 八、對於視頻廣告是否採用修正,0是不使用,1是使用,若是是1,則用戶在網速慢的狀況下會按設定的倒計時進行播放廣告,計時結束則放正片(比較人性化),設置成0的話,則強制播放完廣告才能播放正片 九、是否開啓滾動文字廣告,0是不開啓,1是開啓且不使用關閉按鈕,2是開啓而且使用關閉按鈕,開啓後將在加載視頻的時候加載滾動文字廣告 十、視頻的調整方式 =0是自動調整大小,意思是說大的話就變小,小的話就變大,同時保持長寬比例不變 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟參考對像(pm_video的設置)參數設置的同樣寬高 十一、是否在多視頻時分段加載,0不是,1是 十二、縮放視頻時是否進行平滑處理,0不是,1是 1三、視頻緩衝時間,單位:毫秒,建議不超過300 1四、初始圖片調整方式( =0是自動調整大小,意思是說大的話就變小,小的話就變大,同時保持長寬比例不變 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟pm_video參數設置的同樣寬高 1五、暫停廣告調整方式( =0是自動調整大小,意思是說大的話就變小,小的話就變大,同時保持長寬比例不變 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟pm_video參數設置的同樣寬 1六、暫停廣告是否使用關閉廣告設置,0不使用,1使用 1七、緩衝時是否播放廣告,0是不顯示,1是顯示並同時隱藏掉緩衝圖標和進度,2是顯示並不隱藏緩衝圖標 1八、是否支持鍵盤空格鍵控制播放和暫停0不支持,1支持 1九、是否支持鍵盤左右方向鍵控制快進快退0不支持,1支持 20、是否支持鍵盤上下方向鍵控制音量0不支持,1支持 2一、播放器返回js交互函數的等級,0-2,等級越高,返回的參數越多 0是返回少許經常使用交互 1返回播放器在播放的時候的參數,不返回廣告之類的參數 2返回所有參數 3返回所有參數,而且在參數前加上"播放器ID->",用於多播放器的監聽 2二、快進和快退的秒數 2三、界面上圖片元素加載失敗從新加載次數 2四、開啓加載皮膚壓縮文件包的加載進度提示 2五、使用隱藏控制欄時顯示簡單進度條的功能,0是不使用,1是使用,2是隻在普通狀態下使用 2六、控制欄隱藏設置(0不隱藏,1全屏時隱藏,2都隱藏 2七、控制欄隱藏延時時間,即在鼠標離開控制欄後多少毫秒後隱藏控制欄 2八、左右滾動時是否採用無縫,默認0採用,1是不採用 2九、0是正常狀態,1是控制欄默認隱藏,播放狀態下鼠標通過播放器顯示控制欄,2是一直隱藏控制欄 30、在播放rtmp視頻時暫停後點擊播放是否採用從新連接的方式,這裏一共分0-2三個等級 3一、當採用網址形式(flashvars裏s=1/2時)讀取視頻地址時是採用默認0=get方法,1=post方式 3二、是否啓用播放按鈕和暫停按鈕 3三、是否啓用中間暫停按鈕 3四、是否啓用靜音按鈕 3五、是否啓用全屏按鈕 3六、是否啓用進度調節欄,0不啓用,1是啓用,2是隻能前進(向右拖動),3是隻能後退,4是隻能前進但能回到第一次拖動時的位置,5是看過的地方能夠隨意拖動, 3七、是否啓用調節音量 3八、計算時間的間隔,毫秒 3九、前置logo至少顯示的時間,單位:毫秒 40、前置視頻廣告的默認音量 4一、當s=3/4時加載插件是否從壓縮包里加載,0不是,1是 4二、加載風格是否採用加密方式傳送,該功能普通用戶不能使用 4三、在s=1/2時,調用地址裏的地址是不是相對地址(相對於調用文件),0不是,1是 */ pm_bg: '0x000000,100,230,180', /*播放器總體的背景配置,請注意,這裏只是一個初始化的設置,若是須要真正的改動播放器的背景和最小寬高,須要在風格文件裏找到相同的參數進行更改。 一、總體背景顏色 二、背景透明度 三、播放器最小寬度 四、播放器最小高度 這裏只是初始化時的設置,最終加載完播放器後顯示的效果須要在style.swf/style.xml裏設置該參數 */ mylogo: 'logo.swf', /* 視頻加載前顯示的logo文件,不使用設置成null,即mylogo='null'; */ pm_mylogo: '1,1,-100,-55', /* 視頻加載前顯示的logo文件(mylogo參數的)的位置 本軟件全部的四個參數控制位置的方式所有都是統一的意思,以下 一、水平對齊方式,0是左,1是中,2是右 二、垂直對齊方式,0是上,1是中,2是下 三、水平偏移量,舉例說明,若是第1個參數設置成0左對齊,第3個偏移量設置成10,就是離左邊10個像素,第一個參數設置成2,偏移量若是設置的是正值就會移到播放器外面,只有設置成負值才行,設置成-1,按鈕就會跑到播放器外面 四、垂直偏移量 */ logo: 'cklogo.png', /* 默認右上角一直顯示的logo,不使用設置成null,即logo='null'; */ pm_logo: '2,0,-100,20', /* 播放器右上角的logo的位置 一、水平對齊方式,0是左,1是中,2是右 二、垂直對齊方式,0是上,1是中,2是下 三、水平偏移量 四、垂直偏移量 如下是播放器自帶的二個插件 */ control_rel: 'related.swf,ckplayer/related.xml,0', /* 視頻結束顯示精彩視頻的插件 一、視頻播放結束後顯示相關精彩視頻的插件文件(注意,視頻結束動做設置成3時(即var flashvars={e:3})有效), 二、xml文件是調用精彩視頻的示例文件,能夠自定義文件類型(好比asp,php,jsp,.net只要輸出的是xml格式就行),實際使用中必定要注意第二個參數的路徑要正確 三、第三個參數是設置配置文件的編碼,0是默認的utf-8,1是gbk2312 */ control_pv: 'Preview.swf,105,2000', /* 視頻預覽插件 一、插件文件名稱(該插件和上面的精彩視頻的插件都是放在風格壓縮包裏的) 二、離進度欄的高(指的是插件的頂部離進度欄的位置) 三、延遲時間(該處設置鼠標通過進度欄停頓多少毫秒後才顯示插件) 建議必定要設置延時時間,否則當鼠標在進度欄上劃過的時候就會讀取視頻地址進行預覽,很佔資源 */ pm_repc: '', /* 視頻地址替換符,該功能主要是用來作簡單加密的功能,使用方法很簡單,請注意,只針對f值是視頻地址的時候有效,其它地方不能使用。具體的請查看http://www.ckplayer.com/manual.php?id=4#title_25 */ pm_spac: '|', /* 視頻地址間隔符,這裏主要是播放多段視頻時使用普通調用方式或網址調用方式時使用的。默認使用|,若是視頻地址裏自己存在|的話須要另外設置一個間隔符,注意,即便只有一個視頻也須要設置。另外在使用rtmp協議播放視頻的時候,若是視頻存在多級目錄的話,這裏要改爲其它的符號,由於rtmp協議的視頻地址多級的話也須要用到|隔開流地址和實例地址 */ pm_fpac: 'file->f', /* 該參數的功能是把自定義的flashvars裏的變量替換成ckplayer裏對應的變量,默認的參數的意思是把flashvars裏的file值替換成f值,由於ckplayer裏只認f值,多個替換之間用豎線隔開 */ pm_advtime: '2,0,-110,10,0,300,0', /* 前置廣告倒計時文本位置,播放前置 廣告時有個倒計時的顯示文本框,這裏是設置該文本框的位置和寬高,對齊方式的。一共7個參數,分別表示: 一、水平對齊方式,0是左對齊,1是中間對齊,2是右對齊 二、垂直對齊方式,0是上對齊,1是中間對齊,2是低部對齊 三、水平位置偏移量 四、垂直位置偏移量 五、文字對齊方式,0是左對齊,1是中間對齊,2是右對齊,3是默認對齊 六、文本框寬席 七、文本框高度 */ pm_advstatus: '1,2,2,-200,-40', /* 前置廣告靜音按鈕,靜音按鈕只在是視頻廣告時顯示,固然也能夠控制不顯示 一、是否顯示0不顯示,1顯示 二、水平對齊方式 三、垂直對齊方式 四、水平偏移量 五、垂直偏移量 */ pm_advjp: '1,1,2,2,-100,-40', /* 前置廣告跳過廣告按鈕的位置 一、是否顯示0不顯示,1是顯示 二、跳過按鈕觸發對象(值0/1,0是直接跳轉,1是觸發js:function ckadjump(){}) 三、水平對齊方式 四、垂直對齊方式 五、水平偏移量 六、垂直偏移量 */ pm_padvc: '2,0,-10,-10', /* 暫停廣告的關閉按鈕的位置 一、水平對齊方式 二、垂直對齊方式 三、水平偏移量 四、垂直偏移量 */ pm_advms: '2,2,-46,-56', /* 滾動廣告關閉按鈕位置 一、水平對齊方式 二、垂直對齊方式 三、水平偏移量 四、垂直偏移量 */ pm_zip: '1,1,-20,-8,1,0,0', /* 加載皮膚壓縮包時提示文字的位置 一、水平對齊方式,0是左對齊,1是中間對齊,2是右對齊 二、垂直對齊方式,0是上對齊,1是中間對齊,2是低部對齊 三、水平位置偏移量 四、垂直位置偏移量 五、文字對齊方式,0是左對齊,1是中間對齊,2是右對齊,3是默認對齊 六、文本框寬席 七、文本框高度 */ //pm_advmarquee: '1,2,50,-60,50,18,0,0x000000,50,0,20,1,15,2000', pm_advmarquee: '1,2,50,-60,50,20,0,0x000000,50,0,20,1,30,2000', /* 滾動廣告的控制,要使用的話須要在setup裏的第9個參數設置成1 這裏分二種狀況,前六個參數是定位控制,第7個參數是設置定位方式(0:相對定位,1:絕對定位) 第一種狀況:第7個參數是0的時候,相對定位,就是播放器長寬變化的時候,控制欄也跟着變 一、默認1:中間對齊 二、上中下對齊(0是上,1是中,2是下) 三、離左邊的距離 四、Y軸偏移量 五、離右邊的距離 六、高度 七、定位方式 第二種狀況:第7個參數是1的時候,絕對定位,就是播放器長寬變化的時候,控制欄不跟着變,這種方式通常使用在控制欄大小不變的時候 一、左中右對齊方式(0是左,1是中間,2是右) 二、上中下對齊(0是上,1是中,2是下) 三、x偏移量 四、y偏移量 五、寬度 六、高度 七、定位方式 以上是前7個參數的做用 八、是文字廣告的背景色 九、置背景色的透明度 十、控制滾動方向,0是水平滾動(包括左右),1是上下滾動(包括向上和向下) 十一、移動的單位時長,即移動單位像素所須要的時長,毫秒 十二、移動的單位像素,正數同左/上,負數向右/下 1三、是行高,這個在設置向上或向下滾動的時候有用處 1四、控制向上或向下滾動時每次中止的時間 */ pm_glowfilter:'1,0x01485d, 100, 6, 3, 10, 1, 0, 0', /*滾動文字廣告是否採用發光濾鏡 一、是否使用發光濾鏡,0是不採用,1是使用 二、(default = 0xFF0000) — 光暈顏色,採用十六進制格式 0xRRGGBB。 默認值爲 0xFF0000 三、(default = 100) — 顏色的 Alpha 透明度值。 有效值爲 0 到 100。 例如,25 設置透明度爲 25% 四、(default = 6.0) — 水平模糊量。 有效值爲 0 到 255(浮點)。 2 的乘方值(如 二、四、八、16 和 32)通過優化,呈現速度比其它值更快 五、(default = 6.0) — 垂直模糊量。 有效值爲 0 到 255(浮點)。 2 的乘方值(如 二、四、八、16 和 32)通過優化,呈現速度比其它值更快 六、(default = 2) — 印記或跨頁的強度。 該值越高,壓印的顏色越深,並且發光與背景之間的對比度也越強。 有效值爲 0 到 255 七、(default = 1) — 應用濾鏡的次數 八、(default = 0) — 指定發光是否爲內側發光。 值 1 指定發光是內側發光。 值 0 指定發光是外側發光(對象外緣周圍的發光) 九、(default = 0) — 指定對象是否具備挖空效果。 值爲 1 將使對象的填充變爲透明,並顯示文檔的背景顏色 */ advmarquee: escape('{a href="http://www.ckplayer.com"}{font color="#FFFFFF" size="12"}這裏能夠放文字廣告,播放器默認使用這裏設置的廣告內容,若是不想在這裏使用能夠清空這裏的內容,若是想在頁面中實時定義滾動文字廣告內容,能夠清空這裏的內容,而後在頁面中設置廣告函數。{/font}{/a}'), /* 該處是滾動文字廣告的內容,若是不想在這裏設置,就把這裏清空而且在頁面中使用js的函數定義function ckmarqueeadv(){return '廣告內容'} */ mainfuntion:'', /* 當flashvars裏s=3/4時,調用的函數包名稱,默認爲空,調用時間軸上的函數setAppObj */ flashplayer:'', /* 當flashvars裏的s=3/4時,也能夠把swf文件放在這裏 */ calljs:'ckplayer_status,ckadjump,playerstop,ckmarqueeadv', /* 跳過廣告和播放結束時調用的js函數 */ myweb: escape(''), /* ------------------------------------------------------------------------------------------------------------------ 如下內容部份是和插件相關的配置,請注意,自定義插件以及其配置的命名方式要注意,不要和系統的相重複,否則就會替換掉系統的相關設置,刪除相關插件的話也能夠同時刪除相關的配置 ------------------------------------------------------------------------------------------------------------------ 如下內容定義自定義插件的相關配置,這裏也能夠自定義任何本身的插件須要配置的內容,固然,若是你某個插件不使用的話,也能夠刪除相關的配置 ------------------------------------------------------------------------------------------------------------------ */ cpt_lights: '1', /* 該處定義是否使用開關燈,和right.swf插件配合做用,使用開燈效果時調用頁面的js函數function closelights(){}; */ cpt_share: 'ckplayer/share.xml', /* 分享插件調用的配置文件地址 調用插件開始 */ cpt_list: ckcpt() /* ckcpt()是本文件最上方的定義插件的函數 */ } return ck; } /* html5部分開始 如下代碼是支持html5的,若是你不須要,能夠刪除。 html5代碼塊的代碼能夠隨意更改以適合你的應用,歡迎到論壇交流更改心得 */ (function() { var CKobject = { _K_: function(d){return document.getElementById(d);}, _T_: false, _M_: false, _G_: false, _Y_: false, _I_: null, _J_: 0, _O_: {}, uaMatch:function(u,rMsie,rFirefox,rOpera,rChrome,rSafari,rSafari2,mozilla,mobile){ var match = rMsie.exec(u); if (match != null) { return { b: 'IE', v: match[2] || '0' } } match = rFirefox.exec(u); if (match != null) { return { b: match[1] || '', v: match[2] || '0' } } match = rOpera.exec(u); if (match != null) { return { b: match[1] || '', v: match[2] || '0' } } match = rChrome.exec(u); if (match != null) { return { b: match[1] || '', v: match[2] || '0' } } match = rSafari.exec(u); if (match != null) { return { b: match[2] || '', v: match[1] || '0' } } match = rSafari2.exec(u); if (match != null) { return { b: match[1] || '', v: match[2] || '0' } } match = mozilla.exec(u); if (match != null) { return { b: match[1] || '', v: match[2] || '0' } } match = mobile.exec(u); if (match != null) { return { b: match[1] || '', v: match[2] || '0' } } else { return { b: 'unknown', v: '0' } } }, browser: function() { var u = navigator.userAgent, rMsie = /(msie\s|trident.*rv:)([\w.]+)/, rFirefox = /(firefox)\/([\w.]+)/, rOpera = /(opera).+version\/([\w.]+)/, rChrome = /(chrome)\/([\w.]+)/, rSafari = /version\/([\w.]+).*(safari)/, rSafari2 = /(safari)\/([\w.]+)/, mozilla = /(mozilla)\/([\w.]+)/, mobile = /(mobile)\/([\w.]+)/; var c = u.toLowerCase(); var d = this.uaMatch(c,rMsie,rFirefox,rOpera,rChrome,rSafari,rSafari2,mozilla,mobile); if (d.b) { b = d.b; v = d.v; } return {B: b, V: v}; }, Platform: function() { var w = ''; var u = navigator.userAgent, app = navigator.appVersion; var b = { iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, iPad: u.indexOf('iPad') > -1, ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, webKit: u.indexOf('AppleWebKit') > -1, trident: u.indexOf('Trident') > -1, gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, presto: u.indexOf('Presto') > -1, mobile: !!u.match(/AppleWebKit.*Mobile.*/) || !!u.match(/AppleWebKit/), webApp: u.indexOf('Safari') == -1 }; for (var k in b) { if (b[k]) { w = k; break; } } return w; }, isHTML5:function(){ return !!document.createElement('video').canPlayType; }, getType:function(){ return this._T_; }, getVideo: function() { var v = ''; var s = this._E_['v']; if (s && s.length>1) { for (var i = 0; i < s.length; i++) { var a = s[i].split('->'); if (a.length >= 1 && a[0] != '') { v += '<source src="' + a[0] + '"'; } if (a.length >= 2 && a[1] != '') { v += ' type="' + a[1] + '"'; } v += '>'; } } return v; }, getVars: function(k) { var o=this._A_; if (typeof(o) == 'undefined') { return null; } if (k in o) { return o[k]; } else { return null; } }, getParams: function() { var p = ''; if (this._A_) { if (parseInt(this.getVars('p')) == 1) { p += ' autoplay="autoplay"'; } if (parseInt(this.getVars('e')) == 1) { p += ' loop="loop"'; } if (parseInt(this.getVars('p')) == 2) { p += ' preload="metadata"'; } if (this.getVars('i')) { p += ' poster="' + this.getVars('i') + '"'; } } return p; }, getpath: function(z) { var f='CDEFGHIJKLMNOPQRSTUVWXYZcdefghijklmnopqrstuvwxyz'; var w=z.substr(0,1); if(f.indexOf(w)>-1 && (z.substr(0,4)==w+'://' || z.substr(0,4)==w+':\\')){ return z; } var d = unescape(window.location.href).replace('file:///', ''); var k = parseInt(document.location.port); var u = document.location.protocol + '//' + document.location.hostname; var l = '', e = '', t = ''; var s = 0; var r = unescape(z).split('//'); if (r.length > 0) { l = r[0] + '//' } var h = 'http|https|ftp|rtsp|mms|ftp|rtmp|file'; var a = h.split('|'); if (k != 80 && k) { u += ':' + k; } for (i = 0; i < a.length; i++) { if ((a[i] + '://') == l) { s = 1; break; } } if (s == 0) { if (z.substr(0, 1) == '/') { t = u + z; } else { e = d.substring(0, d.lastIndexOf('/') + 1).replace('\\', '/'); var w = z.replace('../', './'); var u = w.split('./'); var n = u.length; var r = w.replace('./', ''); var q = e.split('/'); var j = q.length - n; for (i = 0; i < j; i++) { t += q[i] + '/'; } t += r; } } else { t = z; } return t; }, getXhr: function() { var x; try { x = new ActiveXObject('Msxml2.XMLHTTP'); } catch(e) { try { x = new ActiveXObject('Microsoft.XMLHTTP'); } catch(e) { x = false; } } if (!x && typeof XMLHttpRequest != 'undefined') { x = new XMLHttpRequest(); } return x; }, getX: function(){ var f='ckstyle()'; if (this.getVars('x') && parseInt(this.getVars('c'))!=1 ) { f=this.getVars('x')+'()'; } try { if (typeof(eval(f)) == 'object') { this._X_ = eval(f); } } catch(e) { try { if (typeof(eval(ckstyle)) == 'object') { this._X_ = ckstyle(); } } catch(e) { this._X_ = ckstyle(); } } }, getSn: function(s, n) { if(n>=0){ return this._X_[s].split(',')[n]; } else{ return this._X_[s]; } }, getUrl: function(L, B) { var b = ['get', 'utf-8']; if (L && L.length == 2) { var a = L[0]; var c = L[1].split('/'); if (c.length >= 2) { b[0] = c[1]; } if (c.length >= 3) { b[1] = c[2]; } this.ajax(b[0], b[1], a, function(s) { var C = CKobject; if (s && s != 'error') { var d = '', e = s; if (s.indexOf('}') > -1) { var f = s.split('}'); for (var i = 0; i < f.length - 1; i++) { d += f[i] + '}'; var h = f[i].replace('{', '').split('->'); if (h.length == 2) { C._A_[h[0]] = h[1]; } } e = f[f.length - 1]; } C._E_['v'] = e.split(','); if (B) { C.showHtml5(); } else { C.changeParams(d); C.newAdr(); } } }); } }, getflashvars: function(s) { var v = '', i = 0; if (s) { for (var k in s) { if (i > 0) { v += '&'; } if (k == 'f' && s[k] && ! this.getSn('pm_repc',-1)) { s[k] = this.getpath(s[k]); if (s[k].indexOf('&') > -1) { s[k] = encodeURIComponent(s[k]); } } if (k == 'y' && s[k]) { s[k] = this.getpath(s[k]); } v += k + '=' + s[k]; i++; } } return v; }, getparam: function(s) { var w = '', v = '', o = { allowScriptAccess: 'always', allowFullScreen: true, quality: 'high', bgcolor: '#000' }; if (s) { for (var k in s) { o[k] = s[k]; } } for (var e in o) { w += e + '="' + o[e] + '" '; v += '<param name="' + e + '" value="' + o[e] + '" />'; } w = w.replace('movie=', 'src='); return { w: w, v: v }; }, getObjectById: function(s) { if (this._T_) { return this; } var x = null, y = this._K_(s), r = 'embed'; if (y && y.nodeName == 'OBJECT') { if (typeof y.SetVariable != 'undefined') { x= y; } else { var z = y.getElementsByTagName(r)[0]; if (z) { x= z; } } } return x; }, ajax: function(b, u, s, f) { var x = this.getXhr(); var a = [], m = ''; if (b == 'get') { if (s.indexOf('?') > -1) { m = s + '&t=' + new Date().getTime(); } else { m = s + '?t=' + new Date().getTime(); } x.open('get', m); } else { a = s.split('?'); s = a[0], m = a[1]; x.open('post', s, true); } x.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); x.setRequestHeader('charset', u); if (b == 'post') { x.send(m); } else { x.send(null); } x.onreadystatechange = function() { if (x.readyState == 4) { var g = x.responseText; if (g != '') { f(g); } else { f(null); } } } }, addListener: function(e, f) { var o=CKobject._V_; if (o.addEventListener) { try{ o.addEventListener(e, f, false); } catch (e) { this.getNot(); } } else if (o.attachEvent) { try{ o.attachEvent('on' + e, f); } catch(e){ this.getNot(); } } else { o['on' + e] = f; } }, removeListener: function( e, f) { var o=CKobject._V_; if (o.removeEventListener) { try{ o.removeEventListener(e, f, false); } catch(e){ this.getNot(); } } else if (o.detachEvent) { try{ o.detachEvent('on' + e, f); } catch(e){ this.getNot(); } } else { o['on' + e] = null; } }, Flash: function() { var f = false,v = 0; if (document.all || this.browser()['B'].toLowerCase().indexOf('ie')>-1) { try { var s = new ActiveXObject('ShockwaveFlash.ShockwaveFlash'); f = true; var z = s.GetVariable('$version'); v = parseInt(z.split(' ')[1].split(',')[0]); } catch(e) {} } else { if (navigator.plugins && navigator.plugins.length > 0) { var s = navigator.plugins['Shockwave Flash']; if (s) { f = true; var w = s.description.split(' '); for (var i = 0; i < w.length; ++i) { if (isNaN(parseInt(w[i]))) continue; v = parseInt(w[i]); } } } } return { f: f, v: v }; }, embed:function(f,d,i,w,h,b,v,e,p,j){ var s=['all']; if(b){ if(this.isHTML5()){ this.embedHTML5(d,i,w,h,e,v,s,j); } else{ this.embedSWF(f,d,i,w,h,v,p); } } else{ if(this.Flash()['f'] && parseInt(this.Flash()['v'])>10){ this.embedSWF(f,d,i,w,h,v,p); } else if(this.isHTML5()){ this.embedHTML5(d,i,w,h,e,v,s,j); } else{ this.embedSWF(f,d,i,w,h,v,p); } } }, embedSWF: function(C, D, N, W, H, V, P) { if (!N) { N = 'ckplayer_a1' } if (!P) { P = { bgcolor: '#FFF', allowFullScreen: true, allowScriptAccess: 'always', wmode:'transparent' }; } this._A_=V; this.getX(); var u = 'undefined', g = false, j = document, r = 'http://www.macromedia.com/go/getflashplayer', t = '<a href="' + r + '" target="_blank">請點擊此處下載安裝最新的flash插件</a>', error = { w: '您的網頁不符合w3c標準,沒法顯示播放器', f: '您沒有安裝flash插件,沒法播放視頻,' + t, v: '您的flash插件版本太低,沒法播放視頻,' + t }, w3c = typeof j.getElementById != u && typeof j.getElementsByTagName != u && typeof j.createElement != u, i = 'id="' + N + '" name="' + N + '" ', s = '', l = ''; P['movie'] = C; P['flashvars'] = this.getflashvars(V); if(W==-1){ d=true; this._K_(D).style.width='100%'; W='100%'; } s += '<object pluginspage="http://www.macromedia.com/go/getflashplayer" '; s += 'classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" '; s += 'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=11,3,0,0" '; s += 'width="' + W + '" '; s += 'height="' + H + '" '; s += i; s += 'align="middle">'; s += this.getparam(P)['v']; s += '<embed '; s += this.getparam(P)['w']; s += ' width="' + W + '" height="' + H + '" name="' + N + '" id="' + N + '" align="middle" ' + i; s += 'type="application/x-shockwave-flash" pluginspage="' + r + '" />'; s += '</object>'; if (!w3c) { l = error['w']; g = true; } else { if (!this.Flash()['f']) { l = error['f']; g = true; } else { if (this.Flash()['v'] < 11) { l = error['v']; g = true; } else { l = s; this._T_=false; } } } if (l) { this._K_(D).innerHTML = l; } if (g){ this._K_(D).style.color = '#0066cc'; this._K_(D).style.lineHeight = this._K_(D).style.height; this._K_(D).style.textAlign= 'center'; } }, embedHTML5: function(C, P, W, H, V, A, S, J) { this._E_ = { c: C, p: P, w: W, h: H, v: V, s: S, j: J==undefined || J?true:false }; this._A_ = A; this.getX(); b = this.browser()['B'], v = this.browser()['V'], x = v.split('.'), t = x[0], m = b + v, n = b + t, w = '', s = false, f = this.Flash()['f'], a = false; if (!S) { S = ['iPad', 'iPhone', 'ios']; } for (var i = 0; i < S.length; i++) { w = S[i]; if (w.toLowerCase() == 'all') { s = true; break; } if (w.toLowerCase() == 'all+false' && !f) { s = true; break; } if (w.indexOf('+') > -1) { w = w.split('+')[0]; a = true; } else { a = false; } if (this.Platform() == w || m == w || n == w || b == w) { if (a) { if (!f) { s = true; break; } }else { s = true; break; } } } if (s) { if (V) { var l = V[0].split('->'); if (l && l.length == 2 && l[1].indexOf('ajax') > -1) { this.getUrl(l, true); return; } } this.showHtml5(); } }, status: function() { this._H_ = parseInt(this.getSn('setup', 20)); var f='ckplayer_status'; if (this.getSn('calljs', 0)!='') { f=this.getSn('calljs', 0); } try { if (typeof(eval(f)) == 'function') { this._L_=eval(f); this._M_=true; return true; } } catch(e) { try { if (typeof(eval(ckplayer_status)) == 'function') { this._L_=ckplayer_status; this._M_=true; return true; } } catch(e) { return false; } } return false; }, showHtml5: function() { var C = CKobject; var p = C._E_['p'], a = C._E_['v'], c = C._E_['c'], j = '', b = false; var s = this._E_['v']; var w=C._E_['w'],h=C._E_['h']; var d=false; var r=''; if(s.length==1){ r=' src="'+s[0].split('->')[0]+'"'; } if(w==-1){ d=true; C._K_(c).style.width='100%'; w='100%'; } if(w.toString().indexOf('%')>-1){ w='100%'; } if(h.toString().indexOf('%')>-1){ h='100%'; } if(C._E_['j']){ j='controls="controls"'; } var v = '<video '+j+r+' id="' + p + '" width="' + w + '" height="' + h + '"' + C.getParams() + '>' + C.getVideo() + '</video>'; C._K_(c).innerHTML = v; C._K_(c).style.backgroundColor = '#000'; C._V_ = C._K_(p); if(!d){ C._K_(c).style.width=C._E_['w'].toString().indexOf('%')>-1?(C._K_(c).offsetWidth*parseInt(C._E_['w'])*0.01)+'px':C._V_.width+'px'; C._K_(c).style.height=C._E_['h'].toString().indexOf('%')>-1?(C._K_(c).offsetHeight*parseInt(C._E_['h'])*0.01)+'px':C._V_.height+'px'; } C._P_ = false; C._T_ = true; if (C.getVars('loaded')!='') { var f=C.getVars('loaded')+'()'; try { if (typeof(eval(f)) == 'function') { eval(f); } } catch(e) { try { if (typeof(eval(loadedHandler)) == 'function') { loadedHandler(); } } catch(e) { } } } C.status(); C.addListener('play', C.playHandler); C.addListener('pause', C.playHandler); C.addListener('error', C.errorHandler); C.addListener('emptied', C.errorHandler); C.addListener('loadedmetadata', C.loadedMetadataHandler); C.addListener('ended', C.endedHandler); C.addListener('volumechange', C.volumeChangeHandler); if((C.getVars('m')!='' && C.getVars('m')!=null) || parseInt( C.getSn('setup', 0))>0){ C._K_(c).style.cursor='pointer'; } if((C.getVars('m')!='' && C.getVars('m')!=null) || parseInt( C.getSn('setup', 1))==1){ C.addListener('click', C.html5Click); } }, videoPlay: function() { if (this._T_) { this._V_.play(); } }, videoPause: function() { if (this._T_) { this._V_.pause(); } }, playOrPause: function() { if (this._T_) { if (this._V_.paused) { this._V_.play(); } else { this._V_.pause(); } } }, fastNext: function() { if (this._T_) { this._V_['currentTime'] = this._V_['currentTime'] + 10; } }, fastBack: function() { if (this._T_) { this._V_['currentTime'] = this._V_['currentTime'] - 10; } }, changeVolume: function(n) { if (this._T_) { this._V_['volume'] = n * 0.01; } }, videoSeek: function(t) { if (this._T_) { this._V_['currentTime'] = t; } }, newAddress: function(u) { var s = []; if (u) { s = this.isHtml5New(u); } else { return; } if (s && this._T_) { this.changeParams(u); var l = s[0].split('->'); if (l && l.length == 2 && l[1].indexOf('ajax') > -1) { this.getUrl(l, false); return; } this._E_['v'] = s; this.newAdr(); } }, quitFullScreen:function() { if(document.cancelFullScreen) { document.cancelFullScreen(); } else if(document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if(document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } }, changeStatus:function(n){ this._H_=n; }, newAdr: function() { var s = this._E_['v']; this._V_.pause(); if(s.length==1){ this._V_.src=s[0].split('->')[0]; } else{ this._V_['innerHTML'] = this.getVideo(); } this._V_.load(); }, isHtml5New: function(s) { if (s.indexOf('html5') == -1) { return false; } var a = s.replace(/{/g, ''); var b = a.split('}'); var c = ''; for (var i = 0; i < b.length; i++) { if (b[i].indexOf('html5') > -1) { c = b[i].replace('html5->', '').split(','); break; } } return c; }, changeParams: function(f) { if (f) { var a = f.replace(/{/g, ''); var b = a.split('}'); var c = ''; for (var i = 0; i < b.length; i++) { var d = b[i].split('->'); if(d.length == 2){ switch(d[0]){ case 'p': if(parseInt(d[1]) == 1){ this._V_.autoplay = true; } else if(parseInt(d[1]) == 2){ this._V_.preload = 'metadata'; } else{ this._V_.autoplay = false; if(this._I_!=null){ clearInterval(this._I_); this._I_=null; } } break; case 'e': if(parseInt(d[1]) == 1){ this._V_.loop = true; } else{ this._V_.loop = false; } break; case 'i': this._V_.poster = d[1]; break; default: break; } } } } }, frontAdPause: function(s) { this.getNot(); }, frontAdUnload: function() { this.getNot(); }, changeFace: function(s) { this.getNot(); }, plugin: function(a, b, c, d, e, f, g) { this.getNot(); }, videoClear: function() { this.getNot(); }, videoBrightness: function(s) { this.getNot(); }, videoContrast: function(s) { this.getNot(); }, videoSaturation: function(s) { this.getNot(); }, videoSetHue: function(s) { this.getNot(); }, videoWAndH: function(a, b) { this.getNot(); }, videoWHXY: function(a, b, c, d) { this.getNot(); }, changeFlashvars: function(a) { this.getNot(); }, changeMyObject: function(a, b) { this.getNot(); }, getMyObject: function(a, b) { this.getNot(); }, changeeFace: function() { this.getNot(); }, changeStyle: function(a, b) { this.getNot(); }, promptLoad: function() { this.getNot(); }, promptUnload: function() { this.getNot(); }, marqueeLoad: function(a,b) { this.getNot(); }, marqueeClose: function(s) { this.getNot(); }, getNot: function() { var s='The ckplayer\'s API for HTML5 does not exist'; return s; }, volumeChangeHandler: function() { var C = CKobject; if (C._V_.muted) { C.returnStatus('volumechange:0', 1); C._O_['volume'] = 0; C._O_['mute'] = true; } else { C._O_['mute'] = false; C._O_['volume'] = C._V_['volume'] * 100; C.returnStatus('volumechange:'+C._V_['volume'] * 100, 1); } }, endedHandler: function() { var C = CKobject; var e=parseInt(C.getVars('e')); C.returnStatus('ended', 1); if(C._I_){ clearInterval(C._I_); C._I_=null; } if ( e!= 0 && e !=4 && e !=6) { return; } if(e==6){ this.quitFullScreen(); } var f='playerstop()'; if (C.getSn('calljs', 2)!='') { f=C.getSn('calljs', 2)+'()'; } try { if (typeof(eval(f)) == 'function') { eval(f); return; } } catch(e) { try { if (typeof(eval(playerstop)) == 'function') { playerstop(); return; } } catch(e) { return; } } }, loadedMetadataHandler: function() { var C = CKobject; C.returnStatus('loadedmetadata', 1); C._O_['totaltime'] = C._V_['duration']; C._O_['width'] = C._V_['width']; C._O_['height'] = C._V_['height']; C._O_['awidth'] = C._V_['videoWidth']; C._O_['aheight'] = C._V_['videoHeight']; if (C._V_.defaultMuted) { C.returnStatus('volumechange:0', 1); C._O_['mute'] = true; C._O_['volume'] = 0; } else { C._O_['mute'] = false; C._O_['volume'] = C._V_['volume'] * 100; C.returnStatus('volumechange:'+C._V_['volume'] * 100, 1); } if (parseInt(C.getVars('p')) == 1) { C.playHandler(); } }, errorHandler: function() { CKobject.returnStatus('error', 1); }, playHandler: function() { var C = CKobject; if (C._V_.paused) { C.returnStatus('pause', 1); C.addO('play', false); if(C._I_!=null){ clearInterval(C._I_); C._I_=null; } } else { C.returnStatus('play', 1); C.addO('play', true); if (!C._P_) { C.returnStatus('play', 1); C._P_ = true; } C._I_ = setInterval(C.playTime, parseInt( C.getSn('setup', 37))); if(!C._G_){ C._G_=true; for(var k in C._A_){ if(k=='g' && C._A_[k]){ var g=parseInt(C._A_[k]); C.videoSeek(g); } } } if(!C._Y_){ C._Y_=true; for(var k in C._A_){ if(k=='j' && C._A_[k]){ var j=parseInt(C._A_[k]); if(j>0){ C._J_=j; } else{ C._J_=parseInt(C._O_['totaltime'])+j; } } } } } }, html5Click: function(){ var C = CKobject; if(C.getVars('m')!='' && C.getVars('m')!=null){ window.open(C.getVars('m')); } }, returnStatus: function(s, j) { var h = s; if (this._H_ == 3) { h = this._E_['p'] +'->'+ h; } if (this._M_ && j <= this._H_ ) { this._L_(h); } }, addO: function(s, z) { this._O_[s] = z; }, getStatus: function() { return this._O_; }, playTime: function() { var C = CKobject; var t = C._V_['currentTime']; C._O_['time'] = t; if(C._J_>0 && t>C._J_){ C._J_=0; C.videoSeek(C._O_['totaltime']); } C.returnStatus('time:' + t, 1); } } window.CKobject = CKobject; })();
<?xml version="1.0" encoding="utf-8"?> <ckplayer> <style> <cpath></cpath> <!-- 播放器風格壓縮包文件的路徑,默認的是style.swf 若是調用不出來能夠試着設置成絕對路徑試試 若是不知道路徑而且使用的是默認配置,能夠直接留空,播放器會自動尋找 --> <language></language> <!-- 播放器所使用的語言配置文件,須要和播放器在同目錄下,默認是language.xml --> <flashvars>{b->1}{p->1}</flashvars> <!-- 這裏是用來作爲對flashvars值的補充,除了c和x二個參數之外的設置均可以在這裏進行配置 1 1 1 1 1 1 1 1 1 1 2 2 2 2 2 2 2 2 2 2 3 3 3 3 3 3 3 3 3 3 4 4 4 4 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 --> <setup>1,1,1,1,1,2,0,1,2,0,0,1,200,0,2,1,0,1,1,1,0,10,3,0,1,2,3000,0,0,0,0,1,1,1,1,1,1,250,0,90,0,0,0</setup> <!-- 這是配置文件裏比較重要的一個參數,共有N個功能控制參數,而且之後會繼續的增長,各控制參數以英文逗號(,)隔開。下面列出各參數的說明: 一、鼠標通過按鈕是否使用手型,0普通鼠標,1手型鼠標,2是隻有按鈕手型,3是控制欄手型 二、是否支持單擊暫停,0不支持,1是支持 三、是否支持雙擊全屏,0不支持,1是支持 四、在播放前置廣告時是否同時加載視頻,0不加載,1加載 五、廣告顯示的參考對象,0是參考視頻區域,1是參考播放器區域 六、廣告大小的調整方式,只針對swf和圖片有效,視頻是自動縮放的 =0是自動調整大小,意思是說大的話就變小,小的話就變大 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟參考對像(第5個控制)參數設置的同樣寬高 七、前置廣告播放順序,0是順序播放,1是隨機播放,>1則隨機取全部廣告中的(N-1)個進行播放 八、對於視頻廣告是否採用修正,0是不使用,1是使用,若是是1,則用戶在網速慢的狀況下會按設定的倒計時進行播放廣告,計時結束則放正片(比較人性化),設置成0的話,則強制播放完廣告才能播放正片 九、是否開啓滾動文字廣告,0是不開啓,1是開啓且不使用關閉按鈕,2是開啓而且使用關閉按鈕,開啓後將在加載視頻的時候加載滾動文字廣告 十、視頻的調整方式 =0是自動調整大小,意思是說大的話就變小,小的話就變大,同時保持長寬比例不變 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟參考對像(pm_video的設置)參數設置的同樣寬高 十一、是否在多視頻時分段加載,0不是,1是 十二、縮放視頻時是否進行平滑處理,0不是,1是 1三、視頻緩衝時間,單位:毫秒,建議不超過300 1四、初始圖片調整方式( =0是自動調整大小,意思是說大的話就變小,小的話就變大,同時保持長寬比例不變 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟pm_video參數設置的同樣寬高 1五、暫停廣告調整方式( =0是自動調整大小,意思是說大的話就變小,小的話就變大,同時保持長寬比例不變 =1是大的化變小,小的話不變 =2是什麼也不變,就這麼大 =3是跟pm_video參數設置的同樣寬 1六、暫停廣告是否使用關閉廣告設置,0不使用,1使用 1七、緩衝時是否播放廣告,0是不顯示,1是顯示並同時隱藏掉緩衝圖標和進度,2是顯示並不隱藏緩衝圖標 1八、是否支持鍵盤空格鍵控制播放和暫停0不支持,1支持 1九、是否支持鍵盤左右方向鍵控制快進快退0不支持,1支持 20、是否支持鍵盤上下方向鍵控制音量0不支持,1支持 2一、播放器返回js交互函數的等級,0-2,等級越高,返回的參數越多 0是返回少許經常使用交互 1返回播放器在播放的時候的參數,不返回廣告之類的參數 2返回所有參數 3返回所有參數,而且在參數前加上"播放器ID->",用於多播放器的監聽 2二、快進和快退的秒數 2三、界面上圖片元素加載失敗從新加載次數 2四、開啓加載皮膚壓縮文件包的加載進度提示 2五、使用隱藏控制欄時顯示簡單進度條的功能,0是不使用,1是使用,2是隻在普通狀態下使用 2六、控制欄隱藏設置(0不隱藏,1全屏時隱藏,2都隱藏 2七、控制欄隱藏延時時間,即在鼠標離開控制欄後多少毫秒後隱藏控制欄 2八、左右滾動時是否採用無縫,默認0採用,1是不採用 2九、0是正常狀態,1是控制欄默認隱藏,播放狀態下鼠標通過播放器顯示控制欄,2是一直隱藏控制欄 30、在播放rtmp視頻時暫停後點擊播放是否採用從新連接的方式,這裏一共分0-3四個等級 3一、當採用網址形式(flashvars裏s=1/2時)讀取視頻地址時是採用默認0=get方法,1=post方式 3二、是否啓用播放按鈕和暫停按鈕 3三、是否啓用中間暫停按鈕 3四、是否啓用靜音按鈕 3五、是否啓用全屏按鈕 3六、是否啓用進度調節欄,0不啓用,1是啓用,2是隻能前進(向右拖動),3是隻能後退,4是隻能前進但能回到第一次拖動時的位置,5是看過的地方能夠隨意拖動, 3七、是否啓用調節音量 3八、計算時間的間隔,毫秒 3九、前置logo至少顯示的時間,單位:毫秒 40、前置視頻廣告的默認音量 4一、當s=3/4時加載插件是否從壓縮包里加載,0不是,1是 4二、加載風格是否採用加密方式傳送,該功能普通用戶不能使用 4三、在s=1/2時,調用地址裏的地址是不是相對地址(相對於調用文件),0不是,1是 --> <pm_bg>0x000000,100,230,180</pm_bg> <!--播放器總體的背景配置 一、總體背景顏色 二、背景透明度 三、播放器最小寬度 四、播放器最小高度 這裏只是初始化時的設置,最終加載完播放器後顯示的效果須要在style.swf/style.xml裏設置該參數 --> <mylogo>null</mylogo> <!-- 視頻加載前顯示的logo文件,不使用設置成<mylogo>null</mylogo> --> <pm_mylogo>1,1,-100,-55</pm_mylogo> <!-- 視頻加載前顯示的logo文件(mylogo參數的)的位置 本軟件全部的四個參數控制位置的方式所有都是統一的意思,以下 一、水平對齊方式,0是左,1是中,2是右 二、垂直對齊方式,0是上,1是中,2是下 三、水平偏移量,舉例說明,若是第1個參數設置成0左對齊,第3個偏移量設置成10,就是離左邊10個像素,第一個參數設置成2,偏移量若是設置的是正值就會移到播放器外面,只有設置成負值才行,設置成-1,按鈕就會跑到播放器外面 四、垂直偏移量 --> <logo>null</logo> <!-- 默認右上角一直顯示的logo,不使用設置成<logo>null</logo> --> <pm_logo>2,0,-100,20</pm_logo> <!-- 播放器右上角的logo的位置 一、水平對齊方式,0是左,1是中,2是右 二、垂直對齊方式,0是上,1是中,2是下 三、水平偏移量 四、垂直偏移量 如下是播放器自帶的二個插件 --> <control_rel>related.swf,related.xml,0</control_rel> <!-- 一、視頻播放結束後顯示相關精彩視頻的插件文件(注意,視頻結束動做設置成3時(即var flashvars={e:3})有效), 二、xml文件是調用精彩視頻的示例文件,能夠自定義文件類型(好比asp,php,jsp,.net只要輸出的是xml格式就行),實際使用中必定要注意第二個參數的路徑要正確 三、第三個參數是設置配置文件的編碼,0是默認的utf-8,1是gbk2312 --> <control_pv>Preview.swf,105,2000</control_pv> <!-- 視頻預覽插件 一、插件文件名稱(該插件和上面的精彩視頻的插件都是放在風格壓縮包裏的) 二、離進度欄的高(指的是插件的頂部離進度欄的位置) 三、延遲時間(該處設置鼠標通過進度欄停頓多少毫秒後才顯示插件) 建議必定要設置延時時間,否則當鼠標在進度欄上劃過的時候就會讀取視頻地址進行預覽,很佔資源 --> <pm_repc></pm_repc> <!-- 視頻地址替換符,該功能主要是用來作簡單加密的功能,使用方法很簡單,請注意,只針對f值是視頻地址的時候有效,其它地方不能使用。具體的請查看http://www.ckplayer.com/manual.php?id=4#title_25 --> <pm_spac>|</pm_spac> <!-- 視頻地址間隔符,這裏主要是播放多段視頻時使用普通調用方式或網址調用方式時使用的。默認使用|,若是視頻地址裏自己存在|的話須要另外設置一個間隔符,注意,即便只有一個視頻也須要設置。另外在使用rtmp協議播放視頻的時候,若是視頻存在多級目錄的話,這裏要改爲其它的符號,由於rtmp協議的視頻地址多級的話也須要用到|隔開流地址和實例地址 --> <pm_fpac>file->f</pm_fpac> <!-- 該參數的功能是把自定義的flashvars裏的變量替換成ckplayer裏對應的變量,默認的參數的意思是把flashvars裏的file值替換成f值,由於ckplayer裏只認f值,多個替換之間用豎線隔開 --> <pm_advtime>2,0,-110,10,0,300,0</pm_advtime> <!-- 前置廣告倒計時文本位置,播放前置 廣告時有個倒計時的顯示文本框,這裏是設置該文本框的位置和寬高,對齊方式的。一共7個參數,分別表示: 一、水平對齊方式,0是左對齊,1是中間對齊,2是右對齊 二、垂直對齊方式,0是上對齊,1是中間對齊,2是低部對齊 三、水平位置偏移量 四、垂直位置偏移量 五、文字對齊方式,0是左對齊,1是中間對齊,2是右對齊,3是默認對齊 六、文本框寬席 七、文本框高度 --> <pm_advstatus>1,2,2,-200,-40</pm_advstatus> <!-- 前置廣告靜音按鈕,靜音按鈕只在是視頻廣告時顯示,固然也能夠控制不顯示 一、是否顯示0不顯示,1顯示 二、水平對齊方式 三、垂直對齊方式 四、水平偏移量 五、垂直偏移量 --> <pm_advjp>0,0,2,2,-100,-40</pm_advjp> <!-- 前置廣告跳過廣告按鈕的位置 一、是否顯示0不顯示,1是顯示 二、跳過按鈕觸發對象(值0/1,0是直接跳轉,1是觸發js:function ckadjump(){}) 三、水平對齊方式 四、垂直對齊方式 五、水平偏移量 六、垂直偏移量 --> <pm_padvc>2,0,-10,-10</pm_padvc> <!-- 暫停廣告的關閉按鈕的位置 一、水平對齊方式 二、垂直對齊方式 三、水平偏移量 四、垂直偏移量 --> <pm_advms>2,2,-46,-56</pm_advms> <!-- 滾動廣告關閉按鈕位置 一、水平對齊方式 二、垂直對齊方式 三、水平偏移量 四、垂直偏移量 --> <pm_zip>1,1,-20,-8,1,0,0</pm_zip> <!-- 加載皮膚壓縮包時提示文字的位置 一、水平對齊方式,0是左對齊,1是中間對齊,2是右對齊 二、垂直對齊方式,0是上對齊,1是中間對齊,2是低部對齊 三、水平位置偏移量 四、垂直位置偏移量 五、文字對齊方式,0是左對齊,1是中間對齊,2是右對齊,3是默認對齊 六、文本框寬席 七、文本框高度 --> <pm_advmarquee>1,2,50,-60,50,18,0,0x000000,50,0,20,1,30,2000</pm_advmarquee> <!-- 滾動廣告的控制,要使用的話須要在setup裏的第9個參數設置成1 這裏分二種狀況,前六個參數是定位控制,第7個參數是設置定位方式(0:相對定位,1:絕對定位) 第一種狀況:第7個參數是0的時候,相對定位,就是播放器長寬變化的時候,控制欄也跟着變 一、默認1:中間對齊 二、上中下對齊(0是上,1是中,2是下) 三、離左邊的距離 四、Y軸偏移量 五、離右邊的距離 六、高度 七、定位方式 第二種狀況:第7個參數是1的時候,絕對定位,就是播放器長寬變化的時候,控制欄不跟着變,這種方式通常使用在控制欄大小不變的時候 一、左中右對齊方式(0是左,1是中間,2是右) 二、上中下對齊(0是上,1是中,2是下) 三、x偏移量 四、y偏移量 五、寬度 六、高度 七、定位方式 以上是前7個參數的做用 八、是文字廣告的背景色 九、置背景色的透明度 十、控制滾動方向,0是水平滾動(包括左右),1是上下滾動(包括向上和向下) 十一、移動的單位時長,即移動單位像素所須要的時長,毫秒 十二、移動的單位像素,正數同左/上,負數向右/下 1三、是行高,這個在設置向上或向下滾動的時候有用處 1四、控制向上或向下滾動時每次中止的時間 --> <pm_glowfilter>0,0x01485d, 100, 6, 3, 10, 1, 0, 0</pm_glowfilter> <!--滾動文字廣告是否採用發光濾鏡 一、是否使用發光濾鏡,0是不採用,1是使用 二、(default = 0xFF0000) — 光暈顏色,採用十六進制格式 0xRRGGBB。 默認值爲 0xFF0000 三、(default = 100) — 顏色的 Alpha 透明度值。 有效值爲 0 到 100。 例如,25 設置透明度爲 25% 四、(default = 6.0) — 水平模糊量。 有效值爲 0 到 255(浮點)。 2 的乘方值(如 二、四、八、16 和 32)通過優化,呈現速度比其它值更快 五、(default = 6.0) — 垂直模糊量。 有效值爲 0 到 255(浮點)。 2 的乘方值(如 二、四、八、16 和 32)通過優化,呈現速度比其它值更快 六、(default = 2) — 印記或跨頁的強度。 該值越高,壓印的顏色越深,並且發光與背景之間的對比度也越強。 有效值爲 0 到 255 七、(default = 1) — 應用濾鏡的次數 八、(default = 0) — 指定發光是否爲內側發光。 值 1 指定發光是內側發光。 值 0 指定發光是外側發光(對象外緣周圍的發光) 九、(default = 0) — 指定對象是否具備挖空效果。 值爲 1 將使對象的填充變爲透明,並顯示文檔的背景顏色背景顏色。 --> <advmarquee></advmarquee> <!-- 該處是滾動文字廣告的內容,若是不想在這裏設置,就把這裏清空而且在頁面中使用js的函數定義function ckmarqueeadv(){return '廣告內容'} --> <mainfuntion></mainfuntion> <!-- 當flashvars裏s=3/4時,調用的函數包名稱,默認爲空,調用時間軸上的函數setAppObj --> <flashplayer></flashplayer> <!-- 當flashvars裏的s=3/4時,也能夠把swf文件放在這裏 --> <calljs>ckplayer_status,ckadjump,playerstop,ckmarqueeadv</calljs> <!-- 跳過廣告和播放結束時調用的js函數 --> <myweb></myweb> <!-- 如下內容部份是和插件相關的配置,請注意,自定義插件以及其配置的命名方式要注意,不要和系統的相重複,否則就會替換掉系統的相關設置,刪除相關插件的話也能夠同時刪除相關的配置 如下內容定義自定義插件的相關配置,這裏也能夠自定義任何本身的插件須要配置的內容,固然,若是你某個插件不使用的話,也能夠刪除相關的配置 --> <cpt_lights>0</cpt_lights> <!-- 該處定義是否使用開關燈,和right.swf插件配合做用,使用開燈效果時調用頁面的js函數function closelights(){}; --> <!--<cpt_share>ckplayer/ckplayer/share.xml</cpt_share>--> <!-- 分享插件調用的配置文件地址 調用插件開始 --> <!--<cpt>right.swf,2,1,0,0,2,0</cpt>右邊開關燈,調整,分享按鈕的插件--> <!--<cpt>share.swf,1,1,-180,-100,3,0</cpt>分享插件--> <!--<cpt>adjustment.swf,1,1,-180,-100,3,0</cpt>調整大小和顏色的插件--> </style> </ckplayer>
function videoLoadJs(s){ alert("執行了播放"); } function playerstop(){ //只有當調用視頻播放器時設置e=0或4時會有效果 alert('播放完成'); } var _nn=0;//用來計算實時監聽的條數的,超過100條記錄就要刪除,否則會消耗內存 function getstart(){ var a=CKobject.getObjectById('ckplayer_1').getStatus(); var ss=''; for (var k in a){ ss+=k+":"+a[k]+'\n'; } alert(ss); } function changePrompt(){ CKobject.getObjectById('ckplayer_1').promptUnload();//卸載掉目前的 CKobject.getObjectById('ckplayer_1').changeFlashvars('{k->10|20|30}{n->重設提示點一|重設提示點二|重設提示點三}'); CKobject.getObjectById('ckplayer_1').promptLoad();//從新加載 } function addflash(){ if(CKobject.Flash()['f']){ CKobject._K_('player1').innerHTML=''; CKobject.embedSWF('ckplayer/ckplayer/ckplayer.swf','player1','ckplayer_1','600','400',flashvars,params); } else{ alert('該環境中沒有安裝flash插件,沒法切換'); } } function addhtml5(){ if(CKobject.isHTML5()){ support=['all']; CKobject._K_('player1').innerHTML=''; CKobject.embedHTML5('player1','ckplayer_1',600,400,video,flashvars,support); } else{ alert('該環境不支持html5,沒法切換'); } } function addListener(){ if(CKobject.getObjectById('ckplayer_1').getType()){//說明使用html5播放器 CKobject.getObjectById('ckplayer_1').addListener('play',playHandler); } else{ CKobject.getObjectById('ckplayer_1').addListener('play','playHandler'); } } function playHandler(){ alert('由於註冊了監聽播放,因此彈出此內容,刪除監聽將再也不彈出'); } function removeListener(){//刪除監聽事件 if(CKobject.getObjectById('ckplayer_1').getType()){//說明使用html5播放器 CKobject.getObjectById('ckplayer_1').removeListener('play',playHandler); } else{ CKobject.getObjectById('ckplayer_1').removeListener('play','playHandler'); } } </script> <input type="button" name="button23" value="切換到flash播放器" onClick="addflash();" /> <input type="button" name="button24" value="切換到html5播放器" onClick="addhtml5();" /> </p> <p>如下的操做對flash播放器和html5播放器都有效</p> <p> <input type="button" name="button5" value="播放" onClick="CKobject.getObjectById('ckplayer_1').videoPlay();" /> <input type="button" name="button6" value="暫停" onClick="CKobject.getObjectById('ckplayer_1').videoPause();" /> <input type="button" name="button7" value="播放/暫停" onClick="CKobject.getObjectById('ckplayer_a1').playOrPause();" /> <input type="button" name="button8" value="快進" onClick="CKobject.getObjectById('ckplayer_1').fastNext();" /> <input type="button" name="button9" value="快退" onClick="CKobject.getObjectById('ckplayer_1').fastBack();" /> <input type="button" name="button15" value="暫停監聽" onClick="CKobject.getObjectById('ckplayer_1').changeStatus(0);" /> <input type="button" name="button16" value="加ID的監聽" onClick="CKobject.getObjectById('ckplayer_1').changeStatus(3);" /> <input type="button" name="button21" value="獲取播放器當前相關屬性" onClick="getstart();" /> <input type="button" name="button13" value="註冊監聽播放事件" onClick="addListener();" /> <input type="button" name="button14" value="刪除監聽播放事件" onClick="removeListener();" /> </p> <p> 播放新參數地址: <input name="newaddress" type="text" id="newaddress" value="" size="60" maxlength="300" /> <input type="button" name="button" id="button" value="跳轉" onClick="CKobject.getObjectById('ckplayer_1').newAddress(document.getElementById('newaddress').value);" /><br> </p> <p id="aboutme"></p> <script type="text/javascript"> var aboutme=''; aboutme+='平臺(瀏覽器)內核:'+CKobject.Platform()+'<br />'; aboutme+='瀏覽器:'+CKobject.browser()['B']+'<br />'; aboutme+='瀏覽器版本:'+CKobject.browser()['V']+'<br />'; aboutme+='是否安裝了flash插件:'+CKobject.Flash()['f']+'<br />'; if(CKobject.Flash()['f']){ aboutme+='flash插件版本:'+CKobject.Flash()['v']+'<br />'; } aboutme+='是否支持HTML5:'+CKobject.isHTML5()+'<br />'; CKobject._K_('aboutme').innerHTML=aboutme;