html暂停视频显示一张图片,HTML5-video标签-实现点击预览图播放或暂停视频

HTML5-video标签-实现点击预览图播放或暂停视频

之前关于视频的控制更多的是运用复杂来实现，但在html5中新加入了标签以及相应的DOM，通过这项新特性，我们能对网页中的视频进行更多简单的控制。

以下属性内容摘抄至W3CSchool

浏览器支持:

注释：Internet Explorer 8 以及更早的版本不支持 标签。

定义和用法

标签定义视频，比如电影片段或其他视频流。

提示和注释

提示：可以在开始标签和结束标签之间放置文本内容，这样老的浏览器就可以显示出不支持该标签的信息。

属性:

new : HTML5 中的新属性。

点击视频预览图实现播放或暂停视频

关于视频的播放控制需要用到video的dom事件，这里先不详述了，以后有机会再将其详细属性搬运过来。这里主要运用到了play() ；pause()这两个事件。

下面是一个自己这两天写的通过点击视频预览图实现视频播放或暂停

HTML部分：

1

2

3

4

5

6

7

8

9

js部分:

var video1=document.getElementById("cideoPlay1");

video1.οnclick=function(){

}

1

2

3

4

5

6

7

8

9

CSS部分对视频播放 不起到影响，暂时就先不在这里贴出来了。

版权声明：本文为博主原创文章，转载请附上博文链接！