HTML5视频扩展插件

  • 能够加入Logo

  • 加入标记

用法:

下载:jquery-video-extend

<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/jquery.video-extend.js"></script>
<script>
$(document).bind('ready',function() {
$("#video1").videoExtend({
logo: 'logo.png',
logoLink: 'http://itmyhome.com',
logoSize: [45, 20],
markers: [{
time: 13.04, // seconds
text: 'Chapter 1'
}]
})
});
<//script>
<video id="video3" width="450" height="260" controls loop autoplay>
<source src="video/simple.mp4" type="video/mp4">
</video>

还有一种方式:

<video width="450" height="260" data-logo="img/logo.png"
data-markers='[{"time":13,"text":"Chapter 1"},{"time":150,"text":"Chapter 2"}]'>
<source src="video/Sintel.mp4" type="video/mp4">
</video>

演示:pushu.me

PS: MP4其它之外格式是否能播放没有验证。

假设MP4视频不能被播放,可能视频的编码格式不是 h264

利用格式工厂对mp4视频,用h264视频编码格式又一次编码,得到的视频就能够使用了。

作者:itmyhome

jQuery Video Extend的更多相关文章

  1. jquery.fn.extend与jquery.extend--(初体验二)

    1.jquery.extend(object); 为扩展jQuery类本身.为类添加新的方法. jquery.fn.extend(object);给jQuery对象添加方法. $.extend({ a ...

  2. jQuery为开发插件提拱了两个方法:jQuery.fn.extend(); jQuery.extend();

    jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...

  3. jQuery的extend方法

    jq中的extend在面试中经常会被问道,今天我总结一个下有关于extend的用法三种进行对比,可能不全,希望大家指点, 用法一: $.extend({})  ,为jQuery类添加方法,可以理解为扩 ...

  4. jQuery.extend和jQuery.fn.extend的区别【转】

    解释的很有意思,清晰明了又有趣,转来分享下,哈哈哈 jQuery.extend和jQuery.fn.extend的区别,其实从这两个办法本身也就可以看出来.很多地方说的也不详细.这里详细说说之间的区别 ...

  5. jQuery原生框架中的jQuery.fn.extend和jQuery.extend

    extend 方法在 jQuery 中是一个很重要的方法,jQuey 内部用它来扩展静态方法或实例方法,而且我们开发 jQuery 插件开发的时候也会用到它.但是在内部,是存在 jQuery.fn.e ...

  6. 理解jquery的$.extend()、$.fn和$.fn.extend()

    jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...

  7. 解读jQuery中extend函数

    $.extend.apply( null, [ true, { "a" : 1, "b" : 2 } ] );//console.log(window.a); ...

  8. jQuery的extend方法的深层拷贝

    一些东西长时间不用就忘了,比如这个jQuery的extend方法的深层拷贝,今天看单页应用的书的时候,看到entend第一个参数是true,都蒙了.也是,自己的大部分对jQuery的学习知识来自锋利的 ...

  9. jQuery.fn.extend(object) object中this的指向

    看到下面的代码后,一下子懵逼了.这个this指向哪儿去了. jQuery.fn.extend({ check: function() { return this.each(function() { t ...

随机推荐

  1. [POJ 1639] Picnic Planning

    [题目链接] http://poj.org/problem?id=1639 [算法] 首先,我们可以用深度优先遍历求出1号节点去除后有几个联通块 设共有T个联通块,若T > K则无解,否则 : ...

  2. PyQt5信号-槽机制

    signal -> emit -> slot signal.connect(slot) signal.disconnect(slot) 信号 (singal) 可以连接无数多个槽 (slo ...

  3. Hadoop MapReduce编程 API入门系列之挖掘气象数据版本3(九)

    不多说,直接上干货! 下面,是版本1. Hadoop MapReduce编程 API入门系列之挖掘气象数据版本1(一) 下面是版本2. Hadoop MapReduce编程 API入门系列之挖掘气象数 ...

  4. KAFKA 调优

    KAFKA 调优 最近要对kafka集群做调优,就在网上看了些资料,总结如下. 我们的kafka版本是0.10.1.0. 机器配置是40G内存,300G硬盘. 一共有3台机器组成一个小的集群. Kak ...

  5. [hihocoder][Offer收割]编程练习赛44

    扫雷游戏 #pragma comment(linker, "/STACK:102400000,102400000") #include<stdio.h> #includ ...

  6. Cupid's Arrow[HDU1756]

    Cupid's Arrow Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tot ...

  7. 【SQL】分析函数功能-排序

    1:排名,不考虑并列问题 row_number() 2:排名,有并列,并列后的排名不连续 rank() 3:排名,有并列,并列后的排名连续 dense_rank() 测试: SQL> creat ...

  8. jquery 星级评价插件jquery Raty的使用

    需要引入的js <script type="text/javascript" src="<%=basePath%>resources/js/jquery ...

  9. H5动效的常见制作手法

    众所周知,一个元素,动往往比静更吸引眼球: 一套操作界面,合适的动态交互反馈能给用户带来更好的操作体验: 一个H5运营宣传页,炫酷的动画特效定能助力传播和品牌打造. 近两年,小到loading动画,表 ...

  10. Ikki's Story IV - Panda's Trick POJ - 3207_dfs跑2-SAT

    Code: #include<cstdio> #include<algorithm> #include<vector> using namespace std; c ...