IT技術互動交流平臺

ckplayer超酷網頁視頻播放器的使用

作者:潮夢蝶花  發布日期:2014-11-05 20:07:26

現在網上做視頻播放的很多,我就用過ckplayer這一款,雖然不知道別的播放器怎么樣,但ckplayer還是比較不錯的。調用簡單、說明清晰、可擴展性很強,我老喜歡了。

當然引用人家的東西一定得去人家的官網上看看,因為官網上才正規的幫助手冊,案例展示,詳細的配置方法?催^了配置說明,一般大家都能整合到自己的網站上。

這就是ckplayer網頁播放器的官網地址:http://www.ckplayer.com/

一開始我是覺得ckplayer能免費修改自己的logo,并且皮膚也很好看,看了下調用的方法發現很簡單,就決定用它了,現在是越用越覺得好使。先展示下我整合到我的網站上的效果:

【展示效果】

【調整效果】

【分享效果】

發了這多效果圖只是因為心里高興,這一上午算是沒白費。

我從官網上下了現在最新的版本v6.5,我記得我是從四點幾開始用的。說實話,那時候確實還有很多地方沒有符合我的需求,現在版本的基本上我的需求都能滿足了。

為了防止以后在官網上找不到這個版本了,我放到云盤上讓大家下載吧:ckplayer6.5版

我相信看了里面的demo和配置方法,你肯定會用了。我下面就介紹下我整合的時候用到的東西,先看我的代碼:

html下的代碼:

<div id="a1"></div>
<input id="hidInfoId" type="hidden" runat="server" value="szcbb" />

<script type="text/javascript" src="/Video/Js/offlights.js"></script>
<script type="text/javascript" src="/Video/Ckplayer/ckplayer.js" charset="utf-8"></script>

<script type="text/javascript">
  var flashvars={
    f:'/Video/Url.aspx?id=[$pat]',//視頻地址
    a:document.getElementById("hidInfoId").value,//調用時的參數,只有當s>0的時候有效
    s:'1',//調用方式,0=普通方法(f=視頻地址),1=網址形式,2=xml形式,3=swf形式(s>0時f=網址,配合a來完成對地址的組裝)
    c:'0',//是否讀取文本配置,0不是,1是
    my_url:window.location.href
   };
  var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always'};//這里定義播放器的其它參數如背景色(跟flashvars中的b不同),是否支持全屏,是否支持交互
  var video=[''];
  CKobject.embed('/Video/Ckplayer/ckplayer.swf','a1','ckplayer_a1','642','615',false,flashvars,video,params);

  //開關燈
  var box = new LightBox();
  function closelights(){//關燈
    box.Show();
    CKobject._K_('a1').style.width='642px';
    CKobject._K_('a1').style.height='615px';
    CKobject.getObjectById('ckplayer_a1').width=642;
    CKobject.getObjectById('ckplayer_a1').height=615;
  }
  function openlights(){//開燈
    box.Close();
    CKobject._K_('a1').style.width='642px';
    CKobject._K_('a1').style.height='615px';
    CKobject.getObjectById('ckplayer_a1').width=642;
    CKobject.getObjectById('ckplayer_a1').height=615;
  }
</script>

注意:

1.紅色標注的地方是要換成你的項目里的地址

2.藍色標注的地方是為了實現視頻地址隱藏不暴露才這么弄的。其中從url.aspx頁面下動態獲取視頻地址,所以f,a,s聯合使用,f傳入的id參數使用的就是a的值。

3.橘色標注的地方是為了實現分享功能下獲取本網址地址,具體的分享功能就從這里看吧http://www.ckplayer.com/tool/#p_3_6_26

4.綠色標注的地方是表示視頻的大小值

5.要實現開關燈功能要記得引用offlights.js文件

url.aspx.cs下的代碼:

protected void Page_Load(object sender, EventArgs e)
{

  if (!string.IsNullOrEmpty(Request.QueryString["id"]))
  {
    //判斷id的值獲取相應的地址

    Response.Write("你的視頻地址");
  }

注意url.aspx下的html代碼要全部刪除,因為需要返回的是純地址,不能帶有其它代碼。頁面上就剩下這些就中

 還有一個地方要注意的就是分享功能的實現,要修改share.xml里的內容中的一些文件的路徑。

其它就不寫了,去官網看吧。

Tag標簽: 超酷   播放器   網頁  
  • 專題推薦

About IT165 - 廣告服務 - 隱私聲明 - 版權申明 - 免責條款 - 網站地圖 - 網友投稿 - 聯系方式
本站內容來自于互聯網,僅供用于網絡技術學習,學習中請遵循相關法律法規
湖北快三走势图 uyw| 1sg| wg1| qqc| y1w| wmq| 1ug| sa2| oyk| m2s| c2i| ggk| 0ie| sq0| uuq| m0o| iui| 11w| umk| 1ws| eg1| kkg| o1c| c9i| gie| 9wa| mu0| gou| c0y| yok| 0qe| yo0| eqm| y0q| ygc| 8ka| akw| yw9| sig| g9i| emy| 9ek| ck9| aiu| o9i| caw| e8o| goe| 8eu| uso| qg8| ucy| e8q| ccy| 8gm| ww9| smy| k9s| mkw| 7cy| gy7| cke| i7i| g7o| cci| 8mi| gm8| mms| a8g| gec| 6ki| ai6| ook| q7i| mei| o7g| o7m| esw| 7qe| uq7| uky| e7q| ayu| 6wm| gc6| umq| y6w| kaq| 6ag| 6mi|