使用HTML5的VIDEO播放RTSP实时视频流源代码:

<!DOCTYPE html>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=gbk">
<title>Video Test 10: RTSP Streaming</title>
<script> function rotateMe() {
i = 0;
int = setInterval(
function () {
video.style.WebkitTransform = 'rotate(' + (i++ %360) + 'deg)';
video.style.MozTransform = 'rotate(' + (i++ %360) + 'deg)';
video.style.OTransform = 'rotate(' + (i++ %360) + 'deg)';
}, 50);
} function resetRotation() {
video.style.WebkitTransform = 'rotate(0)';
video.style.MozTransform = 'rotate(0)';
video.style.OTransform = 'rotate(0)';
} </script>
</head> <body>
<div style="text-align: center;">
<video style="transform: rotate(0deg);" id="v1" controls="controls" onmouseover="this.play()" height="240" width="320">
<source src="rtsp://192.168.1.149:8554/">
html5 video
</video>
</div> <script>
var video = document.getElementsByTagName('video')[0];
</script> <div style="text-align: center;">
<button onclick="video.play()"> ▶ </button>
<button onclick="video.pause()"> ◼ </button>
<button onclick="video.volume += 0.25">Volume Up</button>
<button onclick="video.volume -= 0.25">Volume Down</button>
<button onclick="video.muted = true">Mute</button>
<button onclick="video.muted = false">Unmute</button>
<button onclick="rotateMe()"> Start Rotation</button>
<button onclick="int=window.clearInterval(int);resetRotation()"> Stop Rotation</button>
</div> </body></html>

做人做事实事求是

以下是原贴引用

http://www.oneie.com/index.php/qyjs/video-tech/215-html5-rtsp

有HTML5外包需求的欢迎联系北京动点飞扬QQ:372900288 

我们提供免费项目评估。

HTML5外包团队-技术分享【使用HTML5的VIDEO标记播放RTSP视频流】的更多相关文章

  1. HTML5外包团队——技术分享:HTML5判断设备在线离线及监听网络状态变化例子

    <!doctype html> <html> <head> <meta http-equiv="content-type" content ...

  2. Unity3D外包团队——技术分享U3D全景漫游(三)

    22.给每个物体都附上贴图,如果是纯色物体,也付给纯色贴图 23.打光后,选择要烘培的物体 设置输出路径 添加烘培输出的贴图类型 添加“LightingMap”类型 设置烘培贴图大小和目标贴图位置为“ ...

  3. U3D外包团队—技术分享 U3d中获得物体的size

    以size的x方向为例 1:gameObject.renderer.bounds.size.x;//这个值的结果真实反应出有MeshRenderer这个组件的模型的尺寸.不需要再乘以localScal ...

  4. H5外包团队 技术分享 基于H5+的项目分享

    项目截图:             有H5项目需求欢迎联系我们 我们提供免费的项目评估报价 QQ:372900288 WX:Liuxiang0884

  5. HTML5外包团队:HTML5 Canvas使用教程

    canvas 元素用于在网页上绘制图形. 什么是 Canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像. 画布是一个矩形区域,您可以控制其每一像素. canv ...

  6. HTML5外包团队 更新一下2019最新案例

    本项目控件均为动态加载,3D部分使用Unity3D,其它基于ReactJS,NodeJS,部分使用cocos2D,由于项目涉密,只能发部分截图,欢迎联系索取更多案例,企鹅号 372900288 祝大家 ...

  7. 承接Unity3D外包公司 — 技术分享

    Cardboard SDK for Unity的使用 上一篇文章作为系列的开篇,主要是讲了一些虚拟现实的技术和原理,本篇就会带领大家去看一看谷歌的Cardboard SDK for Unity,虽然目 ...

  8. 全景VR视频外包公司:长年承接VR全景视频外包(技术分享YouTube的360全景视频)

    虽然比预期来得晚了些,但YouTube终于支持360度全景视频了,这应该会吸引不少VR(虚拟现实)爱好者.今年1月,Google就表示这一功能将在“接下来”的几周出现.现在YouTube上已经有了一些 ...

  9. ios外包公司——技术分享:手机应用开发步骤

    1. 确定你的创意 您的创意是否有人做过,如果有类似的app,那就要多多考虑,争取超越并且有一些独特的优化设计在其中 2. 定位应用 通过苹果的人机界面指南(Human Interface Guide ...

随机推荐

  1. python学习------dictionary和set

    一.dictionary 1.字典的形式:a={‘key’:value,‘key1’:value,................} 2.字典的的key不能重复,是一个不可变对象 3.字典的的查找和添 ...

  2. 读javascript高级程序设计16-几条函数小技巧

    内容概要 作用域安全的构造函数 惰性载入函数 函数绑定 函数节流 一.作用域安全的构造函数 我们知道,当使用new操作符调用构造函数时,构造函数内部的this会指向新创建对象的实例. function ...

  3. [转][C/C++] 怎样不用中间变量temp 实现两个数交换

    第一类方法也是常用的方法,通过多次的数值计算来完成交换,到现在知道的有下面三种: (1)加减法. a = a + b; b = a - b; a = a - b; 该方法可以交换整型和浮点型数值的变量 ...

  4. PHP中字符串的连接和换行

    PHP中字符串的连接使用点,不是加号.换行\n需要用双引号括起来,不能用单引号. eg. <?php print_r("hello"."\n"); pri ...

  5. 获取LocationProvider

    Android的定位信息由LocationProvider对象来提供,该对象代表一个抽象的定位组件.在开始编程之前,需要先获得LocationProvider对象. 一.获取所有可用的Location ...

  6. 【转】不是技术牛人,如何拿到国内IT巨头的Offer

    不久前,byvoid面阿里星计划的面试结果截图泄漏,引起无数IT屌丝的羡慕敬仰.看看这些牛人,NOI金牌,开源社区名人,三年级开始写Basic...在跪拜之余我们不禁要想,和这些牛人比,作为绝大部分技 ...

  7. Python的平凡之路(11)

    一. rabbitmq 1 进程Queue:  父进程与子进程进行交互,或者同属于同一父进程下多个子进程进行交互 2 队列通信:   send1.py #!/usr/bin/env python#Au ...

  8. FileWriter和FileReader简单使用

    FileWriter和FileReader使用 package com.main.test; import java.io.FileNotFoundException; import java.io. ...

  9. C语言获得数组长度的函数

    <转自百度知道> 1.c语言中,定义数组后可以用sizeof命令获得数组的长度(可容纳元素个数). 例如: int data[4]; int length; length=sizeof(d ...

  10. Java实现字符串反转的8种方法

    /** * */ package com.wsheng.aggregator.algorithm.string; import java.util.Stack; /** * 8 种字符串反转的方法, ...