Web前端知识

首页 > 免费 > Web前端知识 >

在HTML中插入视频的方法

来源:北京汇仁智杰科技有限公司   时间:2015-12-23   点击:258 次

  向HTML中插入视频的方法有两种:

  1、使用古老的object标签(兼容性良好,但使用比较麻烦)

  2、使用Html5中的video标签(使用比较简单,但兼容性令人头疼)

  虽然后者的兼容性存在很多问题,但是因为使用起来比较方便,符合未来网页设计发展的趋势,因此我们以后者作为页面插入视频的主要方法,又考虑到兼容性的问题,故前者作为辅助。

  代码如下:

  注:当前video元素支持三种视频格式:Ogg\MPEG4\WebM

  Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件

  MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件

  WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件

  在这种情况下,如果视频格式正确,大部分浏览器的兼容性结果我们还算满意,但是IE678不支持它。考虑到用户群的问题,就必须想到另外的解决方案:

  代码如下:

  注:这里面引入了一些文件,除了flv格式的视频,还有几个swf或js文件,都是用DW软件生成的,不想研究<object></object>标签的朋友去DW软件生成就行,如果可以巧妙的融合这两段代码就可以得到兼容所有主流浏览器的终极代码了。

  于是我们可以这样:

  用jquery判断浏览器是否为IE(不用判断具体IE版本,因为服务器的原因IE很可能高版本也不通过,暂且IE全部用<object></object>标签),根据版本加载不同的标签,代码如下:

  到此为止,就可以编写兼容所有浏览器的HTML视频代码了。

网络营销推广 . 北京汇仁智杰科技有限公司!

地址:北京市昌平区回龙观龙冠大厦5层
咨询:13370157521
业务QQ:373002979
E - mail:sales @ huirenzhijie.com
企业网站备案:京ICP备15021091号-1

汇仁智杰与众不同

  • 有网络推广经验
  • 有网站建站队伍
  • 有大型网站建设经验
  • 致力于营销型网站建设
  • 始终坚持技术和服务同样重要
查看PC版网站
备案号:京ICP备15021091号-1 版权所有:汇仁智杰