前段时间闲来无事弄了弄video.js,感觉蛮好玩,能应用到各个应用端,自己在最后玩耍的时候,需要注意的只剩下两方面了,1,动态加载播放视频内容2,双击全屏观看,

var urlRoad = "";
var myPlayer = videojs('my-video');
videojs("my-video", {}, function() {
window.myPlayer = this;
$(" #my-video source").attr("src", "");
myPlayer.src(urlRoad);
myPlayer.load(urlRoad);
myPlayer.play(); });

只需要把路径动态放进去就好,但是点击全屏 就有点懵逼了,找了一下,最后发现了个插件,

https://github.com/ctd1500/videojs-hotkeys,按照方法就ok,瞬间精神爽 ,

var urlRoad = "";
var myPlayer = videojs('my-video');
videojs('my-video').ready(function() {
this.hotkeys({
volumeStep: 0.1,
seekStep: 5,
enableVolumeScroll: false,
enableModifiersForNumbers: false
});
});
videojs("my-video", {}, function() {
window.myPlayer = this;
$(" #my-video source").attr("src", urlRoad);
myPlayer.src(urlRoad);
myPlayer.load(urlRoad);
// myPlayer.enterFullScreen();
myPlayer.play();
myPlayer.on("ended", function(){
videoShowFun (num);
});
});

当然在视频结束后,还可以执行新的方法,言简意赅,贴代码去吧!!

videojs双击全屏幕观看,videojs动态加载视频的更多相关文章

  1. videojs 动态加载视频

    VideoJS dynamic source change via RESTful API 'Undefined' issue with changing RTMP source on compres ...

  2. 动态加载EXE和DLL

    程序中加载了一个DLL文件,但生成的EXE在脱离了DLL文件后仍然可以 单独使用,这是动态加载DLL技术.即:调用资源中的DLL. 此技术的好处:EXE可以使用DLL中的函数,但不会额外增加一 个DL ...

  3. Lodop 动态加载模板,动态加载数据

    最近需要使用Lodop打印控件,所以就研究了一下,期间从网上找了诸多的东西,基本全是对HTML进行打印的,没有找到我想要的,就只好自己动手丰衣足食. 这篇文章主要讲述的是Lodop与数据的结合使用,官 ...

  4. OpenLayers学习笔记(十)— 动态加载JSON数据模拟航迹线

    在openlayers 3 上,加载本地json数据,动态绘制航迹线,以飞机当前位置为地图中心,此例子是模拟DEMO 本文链接:动态加载JSON数据模拟航迹线 作者:狐狸家的鱼 GitHub:八至 前 ...

  5. C#自定义控件、用户控件、动态加载菜单按钮

    一.效果图,动态加载5个菜单按钮: 二.实现方法 1.创建用户控件 2.在用户控件拖入toolStrip 3.进入用户控件的Lood事件,这里自动添加5个选  ToolStripMenuItem,后期 ...

  6. java中的动态加载和热替换

    https://blog.csdn.net/u010833547/article/details/54312052 ****************************************** ...

  7. 二级ul li元素动态加载click事件

    一.代码 html代码: <ul class="id1" id="id1" style="width:84%; height:75%;overf ...

  8. Xib设计UITableViewCell然后动态加载

    转自: http://www.2cto.com/kf/201202/120764.html (注:环境Mac OS X Lion 10.7.3 + Xcode 4.2.1 + iOS SDK 5.0. ...

  9. js动态加载css和js

    之前写了一个工具类点此链接里面含有这段代码,感觉用处挺多,特意提出来 var loadUtil = { /* * 方法说明:[动态加载js文件css文件] * 使用方法:loadUtil.loadjs ...

随机推荐

  1. DOCKER 无法获取使用宿主机DNS 的原因,解决方法

    今天在公司服务器上部署项目,遇到一个大坑.接口怎么请求都不同,宿主机DNS已经改了.宿主可以请求,找了半天,原来是DOCKER 没有获取到主机的DNS 进去DOCKER解析不了域名 指定DNS 启动也 ...

  2. python+selenium+autoit实现文件上传

    问题 在做web端ui层自动化的时候会碰到文件上传的操作,经常有朋友问到,这里总结一下 解决方案 第一种:type=file的上传文件,类似如下的 使用类似这样的代码就可以完成: driver.fin ...

  3. Android使用百度地图出现闪退及定位时显示蓝屏问题

     目录 1.Android使用百度地图出现闪退 2.Android使用百度地图定位出现蓝屏问题     1.Android使用百度地图出现闪退 一般情况下出现闪退是在AndroidManifest.x ...

  4. Web自动化之Headless Chrome开发工具库

    命令行运行Headless Chrome Chrome 安装(需要带梯子) 下载地址 几个版本的比较 Chromium 不是Chrome,但Chrome的内容基本来源于Chromium,这个是开源的版 ...

  5. 关于 Java 面试,你应该准备这些知识点

    来源:占小狼, www.jianshu.com/p/1b2f63a45476 马老师说过,员工的离职原因很多,只有两点最真实: 钱,没给到位 心,受委屈了 当然,我是想换个平台,换个方向,想清楚为什么 ...

  6. Excel 2010高级应用-折线图(二)

    在Excel中画折线图,具体操作过程如下: 1.新建一个excel文件,双击打开 2.单击"插入",找到折线图,单击下拉框 3.在折线框下方,新建数据源 4.鼠标右键,选择&quo ...

  7. Linux显示查看您拥有的仓库

    Linux显示查看您拥有的仓库 youhaidong@youhaidong-ThinkPad-Edge-E545:~$ yum repolist all repolist: 0

  8. tar、scp、sftp、rsync简单使用

    tar -c 创建一个归档文件 -z 指定压缩格式为gzip -v 显示详细信息 -f 制定文件明 -j 指定压缩格式为bz2 -J 指定压缩格式为 xz -C 压缩.解压至某个目录 -x 自动识别压 ...

  9. 8.C++-类的关键字

    在之前学习的C++章节里,可以发现结构体越来越不像C语言里的结构体了 比如,里面可以定义函数,可以定义private/public,结构体名还可以指向父类. 但是C++需要兼容C,所以C++中便提供了 ...

  10. 异常-----freemarker.template.TemplateException: The only legal comparisons are between two numbers, two strings, or two dates

    1.错误描述 六月 26, 2014 10:44:49 下午 freemarker.log.JDK14LoggerFactory$JDK14Logger error 严重: Template proc ...