一：理论

1.视频播放器的格式介绍　　

　　视频主要有三部分组成：视频、音频、编码格式

　　视频格式：avi、rmb、wmv、mpeg4、ogg、webm

 

2.H5的标签video的简单使用

　　<video src="abc.mp4" controls="controls"></video>

　　或者：

　　<video  width="300" controls="controls">

　　　　<source src="abc.mp4" type="video/mp4">

　　　　<source src="abc.ogg" type="video/ogg">

　　</video>

 

3.video的属性

　　

 

二：Demo

1.程序代码

1   2   3 
       4  5      7 26  27 28 
     34 35 
     
36 播放37 暂停38 快进10秒39 快退10秒40 播放速度+41 播放速度-42 声音+43 声音-44 静音45 解除静音46 全屏47 48 

 

2.效果

　　

三：解释程序

1.关于$(document).ready(function(){}的解释

　 是页面一初始化的时候就调用这个方法，把需要执行的逻辑写在function方法体里   就是页面刚开始加载时就调用 相当于s中的 body标签的onload，在文档加载后激活函数。

　　这种方式是jquery框架，封装了浏览器对dom的操作。　

　　如果我们在

　　　　$(document).ready(function(){

　　　　　　加入的内容

　　　　});

　　加入内容$(".btn-slide").click(function(){

          alert("你单击了a标签中class等于btn-slide的连接");

　　});

　　则表示当我们单击class=btn-slide的超级连接时弹出“你单击了a标签中class等于btn-slide的连接”对话框.

 

2.常见的jquery写法如下：　　

　　$("div p"); // (1)

　　$("div.container"); // (2)

　　$("div #msg"); // (3)

　　$("table a",context); // (4)

　　$("#myId"); //(5)

　　第一行代码得到所有<div>标签下的<p>元素。第二行代码得到class 为container的<div>元素,第三行代码得到<div>标签下面id为msg的元素。第四行代码得到context为 上下文的table里面所有的连接元素。第五行代码得到id为myid的所有元素

 

3.获取video的对象方式　

var video = $('#php100'); 这是程序在js里写的程序，下面做一下解释。

　　

　　第一种方式是js的原始写法。

　　第二种是jquery的方式，但是获取的是数组，要想使得对象可以使用，需要在获取数组的第一个元素。

 

4.视频对象的方法API

　　

 

5.单击事件

　　获取id后，使用click获取单击函数。

　　至于函数，就是video数组里的第一个对象，使用其函数。