·您当前的位置:首页 > 技术教程 > 播放器教程 >

带预览的视频播放器(视频播放器 预览功能)预览观看一小段视频

时间:2017-05-31 10:32酷播
带预览的视频播放器(视频播放器 预览功能)预览观看一小段视频,可自定义预览时间秒数的,酷播做预览观看功能的效果教程,视频节目预览(视频收费模式/节目试看)演示效果,使用场景:收费视频,收费课程教程,视频预览功能,节目试看功能。

带预览的视频播放器(视频播放器 预览功能)预览观看一小段视频,可自定义预览时间秒数的。

视频节目预览(视频收费模式/节目试看)演示效果,使用场景:收费视频收费课程教程视频预览功能节目试看功能


产品介绍:本范例实现用户试看一小段视频节目,即关闭视频显示收费信息(收费信息设置在DIV+CSS中实现,不是在播放器内容,使之更为灵活,程序人员可以自由设定);

使用方式:第1步.参数中设定视频结束点秒数:例如JcScpEndTime=18; 第2步,设定getEnd函数,此函数为视频播放到指定时间点,视频结束即执行的函数;第3步,在getEnd函数中实现显示收费信息,比如提示购买,提示登陆,联系方式等等信息。

功能演示:http://www.52player.com/Demos/playergetEnd/
播放器下载:http://www.52player.com/WebPlayer/2016/060173.html

带预览的视频播放器(视频播放器 预览功能)预览观看一小段视频,可自定义预览时间秒数的。
参考的示意代码:

  1. <!--极酷阳光播放器/代码开始--> 
  2. <script type="text/javascript" src="js/swfobject.js"></script> 
  3. <div class="video" id="CuPlayer"><b><img src="images/loading.gif"  /> 网页视频播放器加载中,请稍后...</b></div> 
  4. <script type="text/javascript"> 
  5. var so = new SWFObject("player.swf","myCuPlayer","750","420","9","#000000"); 
  6. so.addParam("allowfullscreen","true"); 
  7. so.addParam("allowscriptaccess","always"); 
  8. so.addParam("wmode","opaque"); 
  9. so.addParam("quality","high"); 
  10. so.addParam("salign","lt"); 
  11. //播放器设置文件----------------------------- 
  12. so.addVariable("JcScpFile","CuSunV4set.xml"); 
  13. //视频文件及略缩图-------------------------- 
  14. //so.addVariable("JcScpServer","rtmp://www.yoursite.com/vod");//流媒体服务器 
  15. so.addVariable("JcScpAutoPlay","yes"); //是否自动播放 
  16. so.addVariable("JcScpEndTime","18"); //视频结束时间点/秒数 
  17. so.addVariable("JcScpVideoPath","http://admin.geely.com/videoFile/geelyxingxiang.flv"); //视频文件地址 
  18. so.addVariable("JcScpImg","images/startpic.jpg");//视频缩略图 
  19. //----------------------------------------- 
  20. so.addVariable("JcScpSharetitle","极酷阳光播放器(CuSunPlayerV3.5)版使用官方演示实例");  
  21. so.write("CuPlayer"); 
  22.  
  23. function getEnd(pars){ 
  24.     var _html = ''
  25.     _html += '<div class="payInfo">'; 
  26.     _html += '<p class="info">该视频为收费视频,请购买后观看</p>'; 
  27.     _html += '<p class="title">您要购买的视频:《小学三年级语文视频教程》</p>'; 
  28.     _html += '<p class="pay">需支付论坛币:10个</p>'; 
  29.     _html += '<p class="paybtn">'; 
  30.     _html += '<a class="btn1" href="http://www.cuplayer.com/cuplayer" target="_blank">购买观看币</a>'; 
  31.     _html += '<a class="btn2" href="http://wpa.qq.com/msgrd?v=3&uin=261532593&site=qq&menu=yes" target="_blank"><i class="qqLogo"></i>在线咨询</a></p>'; 
  32.     _html += '</div>'; 
  33.     document.getElementById('CuPlayer').innerHTML = _html
  34. </script> 
  35.  
  36. <script language=javascript src="js/jquery-1.4.2.min.js" type=text/javascript></script>  
  37. <script language=javascript src="js/action.js" type=text/javascript></script> 
  38.  
  39. <h1>酷播视频节目预览/视频收费模式演示效果</h1> 
  40. <!-- help/Bgein --> 

 

热门文章推荐

请稍候...

保利威视云平台-轻松实现点播直播视频应用

酷播云数据统计分析跨平台播放器