html+vlc 播放多视频

html代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

	<head>

		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<title>视频剪辑</title>

	</head>

	<body>

		<div style="width:100%">

			<div style="width:30%;float:left">

				<object type='application/x-vlc-plugin' id='vlc_1' events='True' width="360" height="270" codebase="axvlc.cab">

					<param name='mrl' value='http://118.85.193.213/mobi/vod/vod_pub/st02/2015/07/28/Q1M_2020878286.3gp' />

					<param name='volume' value='50' />

					<param name='autoplay' value='true' />

					<param name='loop' value='false' />

					<param name='fullscreen' value='false' />

				</object>

				測试计时<span id="span_1"></span>秒

			</div>

			<div style="width:30%;float:left">

				<object type='application/x-vlc-plugin' id='vlc_2' events='True' width="360" height="270" codebase="axvlc.cab">

					<param name='mrl' value='http://118.85.193.213/mobi/vod/vod_pub/st02/2015/07/28/Q600_2020877459.3gp' />

					<param name='volume' value='50' />

					<param name='autoplay' value='true' />

					<param name='loop' value='false' />

					<param name='fullscreen' value='false' />

				</object>

				測试计时<span id="span_2"></span>秒

			</div>

			<div style="width:30%;float:left">

				<object type='application/x-vlc-plugin' id='vlc_3' events='True' width="360" height="270" codebase="axvlc.cab">

					<param name='mrl' value='http://118.85.193.213/mobi/vod/vod_pub/st02/2015/07/28/Q350_2020877450.3gp' />

					<param name='volume' value='50' />

					<param name='autoplay' value='true' />

					<param name='loop' value='false' />

					<param name='fullscreen' value='false' />

				</object>

				測试计时<span id="span_3"></span>秒

			</div>

			<div style="width:30%;float:left">

				<object type='application/x-vlc-plugin' id='vlc_4' events='True' width="360" height="270" codebase="axvlc.cab">

					<param name='mrl' value='http://118.85.193.213/mobi/vod/vod_pub/st02/2015/07/28/M200_2020877455.3gp '/>

					<param name='volume' value='50' />

					<param name='autoplay' value='true' />

					<param name='loop' value='false' />

					<param name='fullscreen' value='false' />

				</object>

				測试计时<span id="span_4"></span>秒

			</div>

			<div style="width:30%;float:left">

				<object type='application/x-vlc-plugin' id='vlc_5' events='True' width="360" height="270" codebase="axvlc.cab">

					<param name='mrl' value='http://118.85.193.213/mobi/vod/vod_pub/st02/2015/07/28/Q200_2020877449.3gp' />

					<param name='volume' value='50' />

					<param name='autoplay' value='true' />

					<param name='loop' value='false' />

					<param name='fullscreen' value='false' />

				</object>

				測试计时<span id="span_5"></span>秒

			</div>

			<div style="width:30%;float:left">

				<object type='application/x-vlc-plugin' id='vlc_6' events='True' width="360" height="270" codebase="axvlc.cab">

					<param name='mrl' value='http://118.85.193.213/mobi/vod/vod_pub/st02/2015/07/28/M100_2020877452.3gp' />

					<param name='volume' value='50' />

					<param name='autoplay' value='true' />

					<param name='loop' value='false' />

					<param name='fullscreen' value='false' />

				</object>

				測试计时<span id="span_6"></span>秒

			</div>	

		</div>

</body>

</html>

js代码

<script type="text/javascript" src="jquery.min.js"></script>

		<script type="text/javascript">

		var vlcArray=new Array()

		$(function() {

			for(var i=1;i<7;i++){

				var vlc_id="vlc_"+i;

				var obj = new vlcObject();

				obj.vlc=document.getElementById(vlc_id);

				vlcArray.push(obj);

			}

			begin();

		})

		function begin(){

			for(var i=1;i<7;i++){

				var index=i-1;

				obj=vlcArray[index];

				//state =3 表示正在播放

				if(obj.vlc.input.state==3){

					if (obj.isPlay==1){

						//观看时长赋值

						obj.seeTime=(new Date().getTime() - obj.beginTime)/1000+obj.stopTime;

					}

					else{

						obj.isPlay=1;

						obj.beginTime=new Date().getTime();

						obj.stopTime=obj.seeTime;

					}

				}

				//state =4 表示暂停播放;state =5 表示停止播放 state =2 表示缓冲

				if (obj.vlc.input.state==4 || obj.vlc.input.state==5 || obj.vlc.input.state==2){

					obj.isPlay=0;

				}

				setSeeTime(obj,i);

			}

			setTimeout("begin()",1000);

		}

		function setSeeTime(obj,id){

			var span_id="#span_"+id;

			$(span_id).html(parseInt(obj.seeTime));

		}

		//自己定义vlc对象

		function vlcObject() {

			var temp = new Object;

			temp.vlc = new Object;

			//观看时长

			temp.seeTime=0;

			//開始播放时间

			temp.beginTime=0

			temp.isPlay=0;

			//暂停前观看的时长

			temp.stopTime=0;

			return temp;

		}

		</script>

自己生成axvlc.cab方法

 现成的axvlc.cab包

html+vlc 播放多视频的更多相关文章

VLC播放RTSP视频延迟问题 (转)
原帖地址:http://blog.chinaunix.net/uid-26611383-id-3755283.html ======================================== ...
VLC播放RTSP视频延迟问题
VLC播放RTSP视频延迟问题配置 VLC 以播放 RTSP/RTP 流实测发现RTP都不如TCP快? vlc播放rtp封装的h.264延时很大是什么原因? 开启打印: VLC的工具->消息 ...
使用vlc播放器播放rtsp流视频
可参考: 使用vlc播放器做rtsp服务器 web网页中使用vlc插件播放相机rtsp流视频使用vlc进行二次开发做自己的播放器首先需要安装vlc播放器,下载及安装步骤略使用vlc播放器播放rt ...
Android内嵌VLC实现播放网络视频，网络音频
1.在对应模块的build.gradle文件中,添加依赖 //VlC implementation "de.mrmaffen:vlc-android-sdk:2.0.6" 2.布局 ...
Qt编写的RTSP播放器+视频监控(vlc版本)
几天写了个ffmpeg版本,今天特意抽空改写个vlc版本,之前vlc播放视频后,被接管了不能识别到鼠标,需要重新编译vlc源码得到支持鼠标消息的版本. /*** vlc视频播放类作者:feiyang ...
网页调用vlc并播放网络视频
环境:windows/android/ios windows端保存以下内容为reg文件并运行 Windows Registry Editor Version 5.00 [HKEY_CLASSES_RO ...
.NET 使用 VLC 播放视频
使用 VLC 播放监控有几个月了,现在是多个项目中都有用到.在使用的过程中也有一些细节供大家参考. 一.对 VLC 的了解 VLC 是一个开源的跨平台多媒体播放器及框架. VLC 官方出的有播放器.编 ...
使用vlc播放器做rtsp流媒体服务器
可参考: 使用vlc播放器播放rtsp视频 web网页中使用vlc插件播放相机rtsp流视频使用vlc进行二次开发做自己的播放器首先需要安装vlc播放器,下载及安装步骤略使用vlc播放器做rts ...
Android VLC播放器二次开发1——程序结构分析
最近因为一个新项目需要一个多媒体播放器,所以需要做个视频.音频.图片方面的播放器.也查阅了不少这方面的资料,如果要从头做一个播放器工作量太大了,而且难度也很大.所以最后选择了VLC作为基础,进行二次开 ...

随机推荐

Hibernate的Session的get()和load()方法区别
hibernate中Session接口提供的get()和load()方法都是用来获取一个实体对象,在使用方式和查询性能上有一些区别. get Session接口提供了4个重载的get方法,分别通过“持 ...
用openrowset函数操作远程数据库
OPENROWSET 包含访问 OLE DB 数据源中的远程数据所需的全部连接信息.当访问链接服务器中的表时,这种方法是一种替代方法,并且是一种使用 OLE DB 连接并访问远程数据的一次性的.特殊的 ...
大数据学习——sql练习
1. 现有如下的建表语句和数据: 建表语句 create table student(Sno int,Sname string,Sex string,Sage int,Sdept string)row ...
mysqlbinlog备份和mysqldump备份
-bash : mysqldump: command not found -bash : mysqlbinlog:command not found 首先得知道mysql命令或mysqldump命令的 ...
【bzoj4240】有趣的家庭菜园贪心+树状数组
题目描述对家庭菜园有兴趣的JOI君每年在自家的田地中种植一种叫做IOI草的植物.JOI君的田地沿东西方向被划分为N个区域,由西到东标号为1~N.IOI草一共有N株,每个区域种植着一株.在第i个区域种 ...
BZOJ 1012 [JSOI2008]最大数maxnumber【线段树】
水题,每次记录一下当前有多少个数,然后按照题目所指示的那样模拟就行,每次向线段树末尾插入(其实是修改)题目中指定的数,然后询问当前的个数到前面Q个数中最大值是多少结果就是,好久不碰线段树了,用数组模拟 ...
算法复习——单调队列(sliding windows,ssoi）
题目: 题目描述给你一个长度为 N 的数组,一个长为 K 的滑动的窗体从最左移至最右端,你只能见到窗口的 K 个整数,每次窗体向右移动一位,如下表:
java面试题之stop()和suspend()方法为何不不推荐使⽤？
stop方法:他是不安全的,他会停止所有运行中的线程: suspend方法:容易发生死锁,虽然调用suspend方法目标线程会停下来,但是仍然持有之前的锁,其他线程都不能访问锁定的资源,就会造成死锁, ...
LinkedList的构造函数有哪些
LinkedList构造函数有(两种): public LinkedList() public LinkedList(Collection<? extends E> c) /** * Co ...
robotframework安装和配置【转IBM：https://www.ibm.com/developerworks/cn/opensource/os-cn-robot-framework/index.html】
内容概览 Robot Framework 介绍 Robot Framework 的安装和配置 RIDE 编辑器介绍创建测试项目简单的测试用例的编写总结相关主题评论 Robot Fr ...

html+vlc 播放多视频

html代码

js代码

html+vlc 播放多视频的更多相关文章

随机推荐

热门专题