Html5插入视频

最新推荐文章于 2024-11-19 10:24:43 发布

枫叶科技521124

最新推荐文章于 2024-11-19 10:24:43 发布

阅读量673

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/qq605053977/article/details/61425610

html5的视频支持格式：

就是这三个，可以秒杀除IE7-8外的所有浏览器。

第一，MP4，H264+AAC
第二，OGV，Ogg Theora+Ogg Vorbis
第三，WEBM，VP8

备注：mp4有3种编码，mpg4(xdiv),mpg4(xvid)，avc(h264)，但是html5只支持avc(h264)编码，所以用格式工厂转换时要注意

 <video poster='/Public/images/video2.png' width = '550' height='400' controls preload>
   <source src="/Public/images/index.mp4" media=" only screen and (min-device-width:568px)"></source>
</video>

备注：

1、可以设置src也可以用source替换。Source可以设置多份源文件的音频播放器。浏览器应该选择它所支持的文件（提高兼容性）

有的时候关闭了播放视频的弹窗，视频继续播放，需要用js触发关闭视频

html代码

<button class="md-close" onclick="playPause()">关闭</button>

js代码

<script type="text/javascript">
function playPause() {
  var myVideo = document.getElementsByTagName('video')[0];
    if (myVideo.paused){
		
      myVideo.play();
	  
     }else{
          myVideo.pause();
     }
}
   
</script>