HTML Video标签属性

html页面代码

<video height="2160" id="playVideo" width="3840" poster="img/blank.png" autoplay="autoplay" preload="auto" >

获取video对象

var media = document.getElementById("playVideo");

不要使用jquery获取,这样会有问题

监听video对象的ended属性实现连续播放

      var curr = 0;
                            var media = document.getElementById("playVideo");
                            media.addEventListener("ended", function () {
                                media.src = videoArr[curr];
                                media.play();
                                curr++;

if (curr >= videoArr.length)
                                    curr = 0;
                            }, false);

更多的属性请参考 http://www.w3school.com.cn/jsref/dom_obj_event.asp

http://www.jianshu.com/p/404d01b8e713/

HTML5 video 连续播放视频的更多相关文章

  1. HTML5 video标签播放视频下载原理

    HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload=" ...

  2. 在使用html5的video标签播放视频时为何只有声音却没有图像

    在使用html5的video标签播放视频时为何只有声音却没有图像? 答:使用格式化工厂转个编码就行了,MP4有3种编码,mpg4(xdiv),,mpg4(xvid),avc(h264)转换成H264编 ...

  3. html5 video微信浏览器视频不能自动播放

    html5 video微信浏览器视频不能自动播放 一.微信浏览器(x5内核): 1.不能自动播放 2.全屏 3.最顶层(z层的最顶层) 二.ios系统解决方案:(无phone手机未测试) <au ...

  4. 解决html5 video不能播放 能播放声音不能播放视频

    <video id="playVideo" style="width:90%; height:auto;" controls poster=". ...

  5. 如何使用微信小程序video组件播放视频

    相信很多人都有在手机上看视频的习惯,比较看视频更真实更形象.那么我们在微信小程序中如何观看视频呢?这就需要video组件的帮忙了.今天我们就给大家演示一下,如何用微信小程序组件video播放视频.我们 ...

  6. Video标签播放视频?谷歌浏览器?safari?? 谷歌浏览器播放不了mp4格式的视频的原因

    webm格式和mp4格式,判断了浏览器能否支持的视频类型后,给了一个if判断,如果是支持mp4格式,就返回视频后缀mp4,如果是webm,就返回后缀webm.结果,在谷歌浏览器中播放不了,为什么我指定 ...

  7. html5 video标签播放视频流

    从文件服务器读取音视频文件,以流的方式传给前台,并能够播放视频. 做了一个demo,用html5的video,audio标签实现. 后台实现代码: @GetMapping(value = " ...

  8. 用HTML5 video标签插入视频,在谷歌浏览器上播放视频时,右下角显示的下载按钮怎么去掉

    使用H5的video标签可以直接插入视频,一般在浏览器效果如下图显示: 但有时在谷歌浏览器上显示,会遇到右下角有下载按钮.如果项目要求去掉这个下载按钮,怎么办呢?如下图显示: 分析: 经本人测试,是谷 ...

  9. HTML5 Video与Audio 视频与音频

    ---- 视频Video对象 - 指定视频播放地址 <video width="320" height="240" controls="cont ...

随机推荐

  1. python3-字典中存储列表

    # Auther: Aaron Fan #示例1:#存储所点披萨的信息pizza = { '外皮':'厚的', '配料列表':['香菇', '奶酪'],}#概述所点的比萨print('您点了一道&qu ...

  2. 《Maven实战》笔记-2-坐标和依赖

    一.依赖范围 Maven在编译项目主代码的时候,需要使用一套classpath——编译classpath: 在编译和执行测试的时候,使用另一套classpath——测试classpath: 实际运行M ...

  3. 基于.NET平台常用的框架整理[转载]

    自从学习.NET以来,优雅的编程风格,极度简单的可扩展性,足够强大开发工具,极小的学习曲线,让我对这个平台产生了浓厚的兴趣,在工作和学习中也积累了一些开源的组件,就目前想到的先整理于此,如果再想到,就 ...

  4. 让 Winform 窗口悬浮的简单方式

    很多次设置这个 TopMost 属性会莫名的不起作用,有时又可以.一直在想是为什么会这样? 后来多次尝试,发现这个属性必须在窗体某些其他属性后设置,比如在 Height.Width 这样的属性后. 看 ...

  5. Glib学习笔记(三)

    你将学到什么 如何实现Object的方法 Object的方法 Object的public方法 在头文件声明一个函数,然后在源文件中实现函数即可 /* declaration in the header ...

  6. hyperledger fabric 中java chaincode 支持离线打包

    联盟链由于其本身的特性,目前应用在一些大型国有企业银行比较多.出于安全考虑,这些企业一般会隔离外网环境.所以在实际生产需求中可能存在需要在一个离线的环境中打包安装chaincode的情况. 本文基于这 ...

  7. Vue知识分享一

    最近想着把之前学的Vue的知识整理一下,方便在公司和同事一起分享.我想要按照下面几个方面去说一下,我对vue的学习理解. 一.什么是VUE vue.js是一个用来开发Web界面的前端库,是很轻量级的工 ...

  8. Centos7安装MySQL8.0

    请到这个地址看:https://www.cnblogs.com/kevingrace/p/10482469.html Centos7安装MySQL8.0 - 操作手册 一.yum安装方式: 卸载之前版 ...

  9. python安装出现的证书问题

    1. pip install pyenv 安装时出现下图错误 Could not install packages due to an EnvironmentError: HTTPSConnectio ...

  10. [USACO18JAN]Cow at Large G(树形DP)

    P4186 [USACO18JAN]Cow at Large G(树形DP) Luogu4186 设dp[i]表示i点需要放多少个农民.则有 \(if(near[i]-dep[i]<=dep[i ...