HTML5实现两个视频循环播放!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>循环播放</title>
</head>
<script type="text/javascript">
    window.onload = function(){
        var index = 0;
        var video = document.getElementById("videoID");
            video.onended = function()
            {
                if(index){
                    index = 0;
                    video.src="222.mp4";
                }else{
                    index = 1;
                    video.src="221.mp4";
                }
            };
    }

</script>
<body>
<video id="videoID" src="222.mp4" autoplay controls="controls" ></video>
</body>
时间: 2024-08-02 20:04:23

HTML5实现两个视频循环播放!的相关文章

H5 多个视频 循环播放效果

跟轮播效果差不多 页面HTML结构 <video id="myvideo" width="100%" height="auto" controls="controls" > 你的浏览器不支持HTML5播放此视频 <span style="white-space:pre"> </span><!-- 支持播放的文件格式 --> <source src=&qu

在wpf中如何让MediaElement的视频循环播放

原文:在wpf中如何让MediaElement的视频循环播放 MediaElement原始的播放是只播放一遍:如何设置让MediaElement播放 的视频或者音频循环播放,解决如下: 修改MediaElement模版 <MediaElement  Name="myMediaElement" Margin="13,35,14,0"  Height="100" VerticalAlignment="Top">    

关于今天写Flex视频循环播放所出现的sdk问题

问题描述:用Flex写的Air视频循环播放,当在FB编辑器中运行测试时,视频可以正常循环,当不内嵌Air打包时就会出现播放一段时间后暂停不播放了. 问题分析:主要是在编辑器里运行正常,一打包就会出现暂停,主要是由于打包后用的电脑的Air环境导致的SDK不匹配,版本的差异性. 解决办法:可以通过打包时内嵌FB自带Air环境即可解决问题.

iOS - 视频循环播放

录制完视频后,我们想在录制视频的预览层上无限循环播放我们的小视频,是不是很炫酷,这时候我们就有三中选择了:1.MPMoviePlayerController2.AVPlayer3.AVAssetReader+AVAssetReaderTrackOutput 但是我们这个预览层是自定义的喔,所以MPMoviePlayerController只能马上给筛选掉了,所以用,那么我们就要用到 AVPlayer 了,虽然上 AVPlayer 最多只能创建16个,性能上不及用 AVAssetReader+AV

html5结合flash实现视频文件在所有主流浏览器兼容播放

由于html5的出现,让网页中的视频.音频有了更加便捷的实现方式.但是video.audio标签只在IE 9+.Safari 3+.FireFox 4+.Opera 10+.Chrome 3+的浏览器版本得到了支持,并且各浏览器对于视频编码格式的支持不一致,这就需要我们考虑一个综合的实现方案,使得视频在不同浏览器中都能顺利播放,而且在老版本的浏览器中也能得到支持. 以下是结合项目经验,总结出的几种方案,与大家分享. 方案1.使用VideoJS插件实现兼容 插件下载http://videojs.c

HTML5上传视频无法播放以及兼容的解决方法

一.视频无法播放原因分析 1.路径不对 <video width="100%" height="100%" controls="controls">   <source src="images/apply.mp4" type="video/mp4"></source>  </video> 在images前面不加斜杠,使用相对路径,不要使用绝对路径 2.视频格式

js控制html5 【video】标签中视频的播放和停止

需求:页面中有2个普通按钮a,b.还有一个video标签,能成功播放出视频..我想要的效果是,点击a按钮,视频开始播放,点击b按钮,视频播放停止!!!<br><br>----------------------------------------------------code---------------------------------------------------------------------------<br><br><!DOCT

HTML5——音频audio与视频video

文件日志地址  http://blog.csdn.net/q1056843325/article/details/60336226 音频与视频现在已经变得越来越流行 各个网站为了保证跨浏览器的兼容性 仍然选择使用flash (源码截自优酷) 多媒体标签 使用 HTML5增加了audio与video两个多媒体标签 兼容性还不错,低版本IE不支持 可以使我们不需要使用任何浏览器插件就能够插入音频与视频控件 而且非常的简单 (源码截自Bilibili) 元素用法如下 1 <audio src="

HTML5全屏背景视频与 CSS 和 JS(插件或库)

译文原链接:http://codetheory.in/html5-fullscreen-background-video/ 前言: 当网页载入时,自动播放的全屏背景视频已经成为当前颇受欢迎的趋势. 就个人而言,我认为自动播放.质量好的视频会增加用户/客户的参与度.应该记住,视频的故事必须与品牌相关. 近年来,我们被FB和Twitter等社交网络上的大量视频所包围. 据研究由此引起了用户更多的参与. 最近我不得不在一个网站上实现相同的功能,因此我决定构建一个用到 HTML5 视频元素并且易于使用的