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. nginx FastCGI模块(FastCGI)配置

    http://www.howtocn.org/nginx:nginx%E6%A8%A1%E5%9D%97%E5%8F%82%E8%80%83%E6%89%8B%E5%86%8C%E4%B8%AD%E6 ...

  2. 6.11Realm简介

    CasRealm 统一认证授权中心  跟单点登录有关的.IniRealm 静态文件

  3. BZOJ 3910 并查集+线段树合并

    思路: 1. 并查集+线段树合并 记得f[LCA]==LCA的时候 f[LCA]=fa[LCA] 2.LCT(并不会写啊...) //By SiriusRen #include <cstdio& ...

  4. 【转】PowerDesigner物理数据表生成C#实体类Model

    model实体类是什么: 在三层架构UI,BLL,DAL中,有时用户插入一条记录到数据库中,必然会有不少数据,按正常编程,也必然会一下子调用某个函数传入不少参数.为了减少参数的数量,达到高效简洁的效果 ...

  5. 前端-Angular思维导图笔记

    看不清的朋友右键保存或者新窗口打开哦!喜欢我可以关注我,还有更多前端思维导图笔记

  6. 第六课: - GroupBy函数

    第 6 课   让我们看一看 groupby 函数. In [1]: # Import libraries import pandas as pd import sys In [2]: print(' ...

  7. intelij idea+springMVC+spring+mybatis 初探(持续更新)

    intelij idea+springMVC+spring+mybatis 初探(持续更新) intellij 创建java web项目(maven管理的SSH) http://blog.csdn.n ...

  8. Android横屏时软键盘全屏问题

    1.使用 SearchView xml加入 android:imeOptions="actionDone|flagNoExtractUi" 可以限制软键盘禁止全屏 <andr ...

  9. 杭电 2095 find your present (2)【位运算 异或】

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2095 解题思路:因为只有我们要求的那个数出现的次数为奇数,所以可以用位运算来做,两次异或同一个数最后结 ...

  10. java 监听控制台输入

    分享一下我写的java监听控制台输入并可以给出响应的功能. 很多时候需要监听控制台的输入内容,相当于信号监听,根据输入的内容做出相应的动作,这里给出我的一个简单实现. 要注意的是:监听得到的消息中前后 ...