html播放mov格式视频,jQuery及video标签视频播放弹窗插件支持mp4,mov等格式详解(图文)...

在做html5做播放视频时，如果是mp4，ogg,webm等视频格式，用h5自带的video标签就可以实现，但苹果的mov格式视频video标签是不支持的。

h5实现mp4视频播放：video标签仅支持Ogg、MPEG4, WebM格式，不支持mov格式。

video标签属性:

video标签扩展使用方法：

(1)使用多种视频格式

和元素有个内置的格式后备系统。我们不使用src属性，而是在其内部嵌套一组元素，浏览器会选择播放第一个它所支持的文件。

我们可以添加WebM格式的视频提供对Opera的支持。

(2)添加Flash后备措施(推荐)

上面那个方法不推荐，应为Opera浏览器只占不到1%的份额。特意为它把视频都转码一边太费事。使用Flash作为备用播放方案还是很方便的，同时Flash还能兼容IE8这种连元素都不支持的老浏览器。

这里使用Flowplayer Flash作为备用播放器(本地下载 ：flowplayer-3.2.18.zip)

data="flowplayer-3.2.18.swf"

type="application/x-shockwave-flash">

(3)也有人优先使用Flash，而HTML5作为后备措施。

这么做是因为Flash普及率比较高，而HTML5作为后备可以扩展iPad和iPhone用户

data="flowplayer-3.2.18.swf"

type="application/x-shockwave-flash">

说完了video标签的使用，很方便，但有一个问题就是不video标签不支持苹果mov格式视频，如果页面上视频两者mp4,mov兼容支持，只能使用插件。

前端视频效果图

video标签mov，无法播放，如图：

使用js插件支持mov格式，

引入jquer和pingzi_video.js，video.css

创建按钮 并给按钮添加class="m-video" 然后就可以用一下两种模式了

创建按钮 并给按钮添加class=“m-video” 然后就可以用一下两种模式了

第一种用法

在元素上添加data-src属性 将视频地址放入其中

第二种用法

在元素上添加data-src属性 放入视频地址,data-menu属性放入文件名 不加 扩展名