加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

如何使用JW Player来播放Flash并隐藏控制按钮和自定义播放完成后

发布时间:2020-12-15 20:01:25 所属栏目:百科 来源:网络整理
导读:转载自:http://www.cnblogs.com/huangtailang/p/4071737.html?utm_source=tuicoolutm_medium=referral 在一个客户项目中播放的flash需要进行定制如不显示控制按钮,flash播放完成后执行特定的js等,在用过了N多的JQery插件和播放器后最终JW Player插件可以
转载自:http://www.cnblogs.com/huangtailang/p/4071737.html?utm_source=tuicool&utm_medium=referral
在一个客户项目中播放的flash需要进行定制如不显示控制按钮,flash播放完成后执行特定的js等,在用过了N多的JQery插件和播放器后最终JW Player插件可以满足我的以上要求
因为 JW Player插件是同事发给我(版本:jwplayer6.6不是最新版本),在将控制按钮隐藏时,根据官网上的参数设置后尽然无效
最终经过摸索才找到原因是官网上的最新版本为6.10版本,而我用的是6.6版本所以不管我怎么配置都是无效的 (部分参数在旧版本不支持)
找到原因就那就简单了,在官网上下载最新的播放器和js文件(下载需要注册)后并配置好经测试果然可以完全隐藏控制按钮,但flash播放器右上方显示了jwplay的logo和网址,显然不可能在客户的项目上显示其他公司的信息,于是将播放器更改了6.6的版本的版本后完美解决问题,在此记录希望帮助有需要的朋友,我跟同事两加一起的大概两天工作日才搞定
我使用的播放器是 破*后的 6.6的版本,官网免费版本有Logo,不同的版本定价 见官网: http://www.jwplayer.com/pricing/

复制代码

<!--htl add 2014-10-31-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"<html xmlns="http://www.w3.org/1999/xhtml"head>
  title>jwplay6.10使用-隐藏控制按钮和视频播放完毕后执行js事件</meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  script  type="text/javascript" class="library" src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></scriptbodydiv id="video">
    ="sp_box"div jwpsrv.com 提供的在线js -->
  script src="http://jwpsrv.com/library/0cnCVGMOEeSQmA6sC0aurw.js"="text/javascript">
   var Player;
  //页面加载的时候
  $(document).ready(function(){  
        LoadingJwPlayer();
          视频开始播放事件
        Player.onPlay((){
             console.log("开始播放视频);
             设置播放器背景色,默认为黑色,但我们的视频是白色的背景,这里无法更改,我只能通过更改源码来解决(jwplayer.js将"#000000"更改为"#ffffff")
             jQuery(#sp_box).css('bgcolor,#ffffff);
        });
        
        视频播放完毕事件
        Player.onPlaylistComplete((){
            console.log(load complay);
            alert(hello,视频播放完毕啦!);
        
        });
      });
    htl edit 2014-11-03加载播放器并设置相关的参数
    jwplayer文档地址:http://www.longtailvideo.com/support/open-video-ads/13048/ova-configuration-guide
   LoadingJwPlayer(){
      Player=jwplayer(sp_box).setup({
          flash显示效果,none,fill,exactfit,uniform,默认为uniform有黑色边框
          参考:http://support.jwplayer.com/customer/portal/articles/1413113-configuration-options-reference#other
          stretching:filltrue自动播放
          controls:false显示控件按钮
           OVA for JW5 only: Turn on playlist control - enables the next/previous controlbar buttons and load the entire playlist into the player in one go.
          allowPlaylistControl:OVA for JWx only: Specifies whether or not overlays and ad notices are to be repositioned based on whether or not the control bar shows and hides.
          assessControlBarState:视频宽
          height: jQuery(document).height(),245)">视频高
          file: http://videos-jp.jwpsrv.com/zWLy8Jer/videos/i8oQD9zd-1753142.mp4?77c801d752d5207784c49e7ed80fb953798fae0fcca03ecf79558496a374b6096b35a35d4d31c99192f10fb8e9b9c158204e6312da47541f86c39eb6119edf45a6f6b4a92a2cb9b13f25fdf1928a4e8e1870f2fa05要播放的文件
          flashplayer: /flash/jwplayer.flash6.6.swf"播放flash的播放器地址,需要替换成你本地的播放器地址
      });       
  }
html>

复制代码

?

显示控制按钮并且flash背景色为黑色的效果(来自官网Demo)

?
隐藏控制按钮并自定义播放完成后执行的JS效果

?
参考:
?
百度网盘JWplay最新版(6.10)和已破*版本(6.6)
?
查看我的在线Demo(使用官网的JS和播放器有Logo)
?
JS~jwPlayer为js预留的回调方法大总结
JW Player使用简介?
JW Player?Documentation
Configuration Options Reference
JW Player?JavaScript API Reference
JW HTML Config: Configures JW Player (5 & 6) using HTML only

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读