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作为基础,进行二次开 ...

随机推荐

数据结构( Pyhon 语言描述 ) — — 第5章：接口、实现和多态
接口接口是软件资源用户可用的一组操作接口中的内容是函数头和方法头,以及它们的文档设计良好的软件系统会将接口与其实现分隔开来多态多态是在两个或多个类的实现中使用相同的运算符号.函数名或方法.多 ...
我的Python分析成长之路9
pandas入门统计分析是数据分析的重要组成部分,它几乎贯穿整个数据分析的流程.运用统计方法,将定量与定性结合,进行的研究活动叫做统计分析.而pandas是统计分析的重要库. 1.pandas数据结 ...
基于顺序链表的栈的顺序存储的C风格实现
头文件: #ifndef _SEQSTACK_H_ #define _SEQSTACK_H_ typedef void SeqStack; //创建一个栈 SeqStack* SeqStack_Cre ...
【LeetCode】Spiral Matrix(螺旋矩阵)
这是LeetCode里的第54道题. 题目要求: 给定一个包含 m x n 个元素的矩阵(m 行, n 列),请按照顺时针螺旋顺序,返回矩阵中的所有元素. 示例 1: 输入: [ [ 1, 2, 3 ...
PAT Basic 1051
1051 复数乘法复数可以写成 (A+Bi) 的常规形式,其中 A 是实部,B 是虚部,i 是虚数单位,满足 i2=−1:也可以写成极坐标下的指数形式 (R×e(Pi)),其中 R 是复 ...
彻底理解Python中的yield
阅读别人的python源码时碰到了这个yield这个关键字,各种搜索终于搞懂了,在此做一下总结: 通常的for…in…循环中,in后面是一个数组,这个数组就是一个可迭代对象,类似的还有链表,字符串,文 ...
Knockout v3.4.0 中文版教程-3-监控-通过监控创建视图模型（下）
6. 显式订阅监控你通常不需要手动设置订阅,所以初学者应该跳过这一节. 对于高级用户,如果你想注册自己的订阅来监控通知变化,你可以使用 subscribe函数,比如: myViewModel.per ...
面试准备——redis
https://blog.csdn.net/yangzhong0808/article/details/81196472 http://www.imooc.com/article/36399 http ...
HDU-4825 Xor Sum，字典树好题！
Xor Sum 一遍A了之后大呼一声好(keng)题!debug了两小时~~~~百度之星资格赛,可以. 题意:给你一个n个元素的数组,m次查询,每次输入一个数k要求从数组中找到一个数与k异或值最大,输 ...
OkHttpUtil
package jp.co.gunmabank.util import android.os.Handlerimport android.os.Looperimport com.google.gson ...

html+vlc 播放多视频

html代码

js代码

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

随机推荐

热门专题