判断浏览器是否支持HTML5 video
话不多说,下面是我从W3C扒的判断浏览器是是否支持H5视频的代码,有需要的小伙伴,拿走不谢
HTML
<div id="checkVideoResult"><button onclick="checkVideo()">检测</button></div>
JS (代码格式是整理过的,不过复制进来就这样了,小伙伴们自己格式化一下哈)
function checkVideo() {
if(!!document.createElement('video').canPlayType) {
var vidTest = document.createElement("video");
oggTest = vidTest.canPlayType('video/ogg; codecs="theora, vorbis"');
if(!oggTest) {
h264Test = vidTest.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
if(!h264Test) {
document.getElementById("checkVideoResult").innerHTML = "抱歉你的浏览器不支持HTML5 video标签!."
} else {
if(h264Test == "probably") {
document.getElementById("checkVideoResult").innerHTML = "非常棒!你的浏览器支持HTML5 video标签!";
} else {
document.getElementById("checkVideoResult").innerHTML = "Meh. Some support.";
}
}
} else {
if(oggTest == "probably") {
document.getElementById("checkVideoResult").innerHTML = "非常棒!你的浏览器支持HTML5 video标签!";
} else {
document.getElementById("checkVideoResult").innerHTML = "Meh. Some support.";
}
}
} else {
document.getElementById("checkVideoResult").innerHTML = "Sorry. No video support."
}
}
判断浏览器是否支持HTML5 video的更多相关文章
- 判断浏览器是否支持html5和css3属性
本文章内容是由一个前辈写的. CSS3特有的属性moz-Transform //判断是否具有相应属性 testProps: function (props) { var i; for (i in pr ...
- ie8及ie8以下支持html5 video标签
html5media是一个很给力的JavaScript类库,它不依赖于任何JavaScript框架.使用了html5media之后,当浏览器不支持HTML5时,它将会自动切换成Flash模式的Flow ...
- 浏览器不支持HTML5
有些浏览器并不支持HTML5中的新增元素,如IE8或更早版本.想要应用样式,可以头部标记<head>中加入下面JavaScript代码 <html> <head> ...
- 判断浏览器是否支持FileReader
1.js代码: //判断浏览器是否支持FileReader if (typeof FileReader == "undefined") { document.write(" ...
- 新Chrome浏览器不支持html5的问题
window.applicationCache事件,最新chrome浏览器已经不能判断是否支持html5: 之前,在IE和Google中 为ApplicationCache对象,而在FF中为 Offl ...
- 判断浏览器是否支持某个css3属性的javascript方法
判断浏览器是否支持css3某个属性的方法: /** * 判断浏览器是否支持某一个CSS3属性 * @param {String} 属性名称 * @return {Boolean} true/false ...
- JS判断浏览器是否支持某一个CSS3属性
1.引子 css3的出现让浏览器的表现更加的丰富多彩,表现冲击最大的就是动画了,在日常书写动画的时候,很有必要去事先判断浏览器是否支持,尤其是在写CSS3动画库的时候.比如transition的ani ...
- document.documentElement.style判断浏览器是否支持Css3属性
1.document.documentElement.style 属性定义了当前浏览器支持的所有Css属性 包括带前缀的和不带前缀的 例如:animation,webkitAnimation,msAn ...
- 判断浏览器是否支持H5
window.onload = function() { if (!window.applicationCache) { alert("请升级您的浏览器版本,你的浏览器不支持HTML5!&q ...
随机推荐
- Tigase-01 使用spark或spi登录Tigase服务器
喜欢研究IM技术的同学们,欢迎加入群 310790965 一起来学习,有什么问题可以一起讨论. 本源码是基于tigase v7.1.0来分析的,群里文件中会上传一个完整能跑的源代码压缩包,网上tiga ...
- skynet记录6:定时器
稍后填坑 kernel中,每一次时钟中断会trap到kernel code,这个时间间隔称之为jiffies,每秒钟发生的次数为HZ 如果是4核,分配到每个核就是HZ/4 cat /boot/conf ...
- MAC使用超级终端
其实很简单. 先用ls看看/dev/tty.*哪个是具体的串口,我这里使用的edison的板子,所以插到macos上后可以看到的设备节点为: 只需要使用screen 命令即可,具体的命令格式如下: s ...
- 201621123002《java程序设计》第十二周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 面向系统综合设计-图书馆管理系统或购物车 使用流与文件改造你的图书馆管理系统或购物车. 2.1 简述如何 ...
- redis相关运维命令
1. 查询redis里面的大key? 在redis实例上执行bgsave,然后我们对dump出来的rdb文件进行分析,找到其中的大KEY 有个不太推荐的命令,debug object xxx 可以看到 ...
- 项目管理-工作量评估 Manday
People's suggestion, 逻辑有待验证 1. Project sponsor - a new request 2. Study the related issue, to define ...
- 《Java核心技术卷1》拾遗
之前对Java的基础知识有过学习,现在开始学习<Java核心技术卷1>,将一些新学的知识点,做简要记录,以备后续回顾: 1.double (1)所有的“非数值”都认为是不相同的 if(x= ...
- Springboot & Mybatis 构建restful 服务五
Springboot & Mybatis 构建restful 服务五 1 前置条件 成功执行完Springboot & Mybatis 构建restful 服务四 2 restful ...
- 【此处有干货~】jmeter+ant+jenkins持续集成配置及过程中问题解决思路
本人是一枚工作近三年的小测试,大学正好专业为软件测试,在工作中用到最多的是功能测试.接口测试.压力测试.偶尔会涉及到性能测试......(小白,很多观念技术跟大佬差距太大,勿喷) 在接口测试过程当中, ...
- monkey测试样例
我们通过在CMD窗口中执行: adb shell monkey {+命令参数}来进行Monkey测试了.首先,我们准备了一个有bug的项目CityWeather:通过测试这个项目(源码在附件文件夹中) ...