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

最新推荐文章于 2024-07-09 10:01:14 发布

b10l07

最新推荐文章于 2024-07-09 10:01:14 发布

阅读量506

点赞数

文章标签： php

本文链接：https://blog.csdn.net/weixin_33816821/article/details/85087533

版权

使用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" οnmοuseοver="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 οnclick="video.play()"> &#9654; </button>    <button οnclick="video.pause()"> &#9724; </button>    <button οnclick="video.volume += 0.25">Volume Up</button>    <button οnclick="video.volume -= 0.25">Volume Down</button>    <button οnclick="video.muted = true">Mute</button>    <button οnclick="video.muted = false">Unmute</button>    <button οnclick="rotateMe()"> Start Rotation</button>    <button οnclick="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：３７２９００２８８　

我们提供免费项目评估。

b10l07

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
HTML5外包团队-技术分享【使用HTML5的VIDEO标记播放RTSP视频流】

使用HTML5的VIDEO播放RTSP实时视频流源代码： &lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;meta http-equiv="content-type" content="text/html; charset=gbk"&gt; &lt;title&gt;Video Test 10: RTSP Streaming&l
复制链接

扫一扫