HTML5视频播放插件Video.js使用详解

一、Video.js简介

Video.js 是一个开源的 Html5 jquery 视频插件,这个插件可以用来处理 Flash 视频,它还是一个多平台支持的产品。 Moreover,YouTube,Vimeo 等等的视频都可以很好地通过这个插件来播放。这个插件还支持桌面应用程序和其它的手持设备。Video.js 自动检测浏览器对 HTML5 的支持情况,如果不支持 HTML5 则自动使用 Flash 播放器。

二、快速入门

我们可以下载 Video.js 的源码放到自己的服务器上,或者使用免费的 CDN 托管版本。

(1)在页面中引用video-js.cs样式文件和video.js

<link href="video-js.css" rel="stylesheet" type="text/css">
<script src="video.js"></script>

(2)使用免费的CDN托管版本

<link href="http://vjs.zencdn.net/4.12/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/4.12/video.js"></script>

链接地址:http://www.xttblog.com/?p=819

 

时间: 2024-10-01 10:23:37

HTML5视频播放插件Video.js使用详解的相关文章

移动端日期插件Mobiscroll.js使用详解_javascript技巧

mobiscroll js日期插件的基础入门案例,移动端开发过程中可能会用到. <html> <head> <meta charset="UTF-8"> <title>mobiscroll</title> <link type="text/css" rel="stylesheet" href="../js/mobiscroll.custom-2.6.2.min.css&q

JavaScript语法高亮插件highlight.js用法详解【附highlight.js本站下载】[原创]_javascript技巧

本文实例讲述了JavaScript语法高亮库highlight.js用法.分享给大家供大家参考,具体如下: highlight.js是一款基于JavaScript的语法高亮库,目前支持125种编程语言,有63种可供选择的样式,而且能够做到语言自动识别,和目前主流的JS框架都能兼容,可以混合使用. 这款高亮库可以用在博客系统中,其使用方法及其简单,几乎不需要任何学习成本,下面介绍highlight.js的使用. 1.获取highlight.js库,用户可以从官网获取: 地址:https://hig

Jquery揭秘系列:ajax原生js实现详解(推荐)_jquery

讲到ajax这个东西,我们要知道两个对象XMLHTTPRequest和ActiveXObject ,提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力.可以同步或异步返回 Web 服务器的响应,并且能以文本或者一个 DOM 文档形式返回内容.XMLHTTPRequest基本上算是标准化了,兼容大部分浏览器ActiveXObject这玩儿意儿是微软的东西,所以是为了兼容IE版本,我们用的只是它的xmlHTTP功能. 为了功能的明确和清晰,我们

JS插件overlib用法实例详解_javascript技巧

本文实例讲述了overlib用法.分享给大家供大家参考,具体如下: overLIB 是一个生成提示框与弹出菜单等页面效果的一段非常优秀的JS代码. 它可以简单的通过设置一些参数或命令来改变弹出页面的款式.皮肤与形状,不但如此,它还提供了非常简单的扩展功能,来足客户的不同需求. overLIB 使用非常的简单. 一.在<head></head> 标签内添加: 复制代码 代码如下: <script type="text/javascript" src=&quo

[HTML5和Flash视频播放器]Video.js 学习笔记(一 ) HLS库:videojs-contrib-hls

  DEMO地址:https://github.com/Tinywan/PHP_Experience   https://github.com/videojs/videojs-contrib-hls  下载JS文件,直接使用 <video id=example-video width=600 height=300 class="video-js vjs-default-skin" controls> <source src="https://example.

视频播放器之————JW Player参数详解

JW Player参数详解 1,安装 下载后,你可以得到一个例子,当用文本或HTML编辑器打开的时候,你可以发现swf是用一段短小的 javascript嵌入到页面上的.这个Javascript是Geoff Stearns写的swfobject.js,它解决了Flash需要激 活的麻烦.当复制swf到你的站点的时候,不要忘记了把swfobject.js一同复制过去.并且在页面中的 Head中加入下面代码 程序代码 <script type="text/javascript" sr

jQuery validate插件功能与用法详解_jquery

本文实例讲述了jQuery validate插件功能与用法.分享给大家供大家参考,具体如下: 前言:对于表单内容格式的验证,原生JS的写法,较为繁琐,笔者曾在写一个注册界面的时候,验证邮箱格式,用户名格式,密码格式,多处使用了正则,并且错误提示信息也要用display:none/显示隐藏,在用过jQuery validate插件后,则大大加快了开发速度! 1.jQuery validate插件提供了强大的验证功能,jQuery validate插件的官网是http://jqueryvalidat

jQuery验证插件validate使用方法详解_jquery

1. 写在前面 我们知道,用户在注册的时候,会有个表单页面,然后有些选项是必填的,有些要填的内容是有规范的,这些都要在用户提交之前进行验证才行,如果不符合要求,需要在右边显示一个友好的提示,让用户修改. 记得以前在学习Servlet的时候,实现一个简单的用户注册功能的验证是在后台做的,有些用了正则表达式,有些没用,但是都比较简单.流程是这样的,前台提交表单数据后,servlet获取数据先进行验证,如果不符合要求,将提示信息放到一个List中,然后再把List存到session中,跳转到一个新的页

微信小程序使用第三方库Immutable.js实例详解_javascript技巧

前言 Immutable JS 提供一个惰性 Sequence,允许高效的队列方法链,类似 map 和 filter ,不用创建中间代表.immutable 通过惰性队列和哈希映射提供 Sequence, Range, Repeat, Map, OrderedMap, Set 和一个稀疏 Vector. 微信小程序无法直接使用require( 'immutable.js' )进行调用,需要对下载的Immutable代码进行修改,才能使用. 原因分析 Immutable使用了UMD模块化规范 (f