modernizr.js
1.判断浏览器是否支持 h5
if(Modernizr.canvas){
alert(123);
}else{
alert(321);
}
2.判断浏览器是否支持 canvas
function supert_canvas(){
if(Modernizr.canvas){
alert("是");
}else{
alert("否");
} }
或者
function supert_canvas(id){
return !! document.getElementById(id).getContext("2d");
}
3.判断浏览器是否支持 canvas 的fliiText()
if(Modernizr.canvastext){
alert(123);
}else{
alert(321);
}
或者
function supert_canvas1_fillText(){
var canvas1 = document.getElementById("canvas1");
var context = canvas1.getContext("2d");
return typeof context.fillText == 'function';
}
4.判断浏览器是否支持 视频播放器
function supert_video (id){
return !! document.getElementById(id).canPlayType;
}
也可以
if(Modernizr.video){
alert("支持");
}else{
alert("不支持");
}
4.判断浏览器是否支持 webM 视频 编码格式
function support_webm_video(){
if(!support_video()){ return false}
var v = document.createElement("video");
return v.canPlayType('video/webm; codecs="vp8,varbis"'); }
或者
function supports_webm_video(){
if(Modernizr.video){
// 可以播放视频了,但是播放哪一种格式呢?
if(Modernizr.video.oog){
// 尝试在 Ogg 容器中使用 Ogg Theora + Vorbis
}else if (){
// 尝试在 MP4 容器中使用 h.264 视频 + AAC 音频
} }
}
5.判断浏览器是否支持 本地存储
function support_local_storage(){ return ('localStorage' in window ) && window['localStorage'] != null;
}
或者
if(Modernizr.localstorage){
alert("ok");
}else{
alert("no ok");
}
6.判断浏览器是否支持 web workers
function support_web_workers(){
return !! window.Worker; }
或者
if(Modernizr.webworkers){
}else{
}
7.判断浏览器是否支持 web workers
function support_offline(){
return !! window.applicationcache;
}
或者
if(Modernizr.applicationcache){
}else{
}
8.判断浏览器是否支持 geolocation
function support_geolocation(){
return !! window.geolocation;
}
或者
if(Modernizr.geolocation){
}else{
}
9.判断浏览器是否支持 输入框类型
if(Modernizr.inputtypes.data){
}else{
}
10.判断浏览器是否支持 占位文本
if(Modernizr.input.placeholder){
}else{
}
11.判断浏览器是否支持 表单自动聚焦
if(Modernizr.input.autofocus){
}else{
}
或者
function support_input_autofocus(){
return 'autofocus' in document.createElement('input');
}
11.判断浏览器是否支持 微数据
function support_input_autofocus(){
return !! window.getItems;
}
modernizr.js的更多相关文章
- Modernizr.js:为HTML5和CSS3而生!
原文链接:http://caibaojian.com/modernizr-js.html modernizr这个JS,在国外的主题里面很多地方都看到,就只记得是为html补充的,有点类似与respon ...
- HTML5系列四(特征检测、Modernizr.js的相关介绍)
Modernizr:一个HTML5特征检测库 Modernizr帮助我们检测浏览器是否实现了某个特征,如果实现了那么开发人员就可以充分利用这个特征做一些工作 Modernizr是自动运行的,无须调用诸 ...
- 前端的瑞士军刀:Modernizr.js
前言 Modernizr.js既能给老版本浏览器打补丁,又能保证新浏览器渐进增强的用户体验. 作用: 从实际操作来看,Modernizr默认做的事情很少,除了(在你选择的情况下)给不支持html5的标 ...
- Modernizr.js入门指南(HTML5&CSS3浏览器兼容插件)
HTML5 和 CSS3 的快速发展,给我们带来了极大的便利,比如从此再也不用花费大量的时间只是为了设计一个圆角的效果. 但是!我们不能像控制机器一样来控制所有的人都一夜之间升级到现代浏览器,因为那些 ...
- Modernizr.js介绍与使用
Modernizr帮助我们检测浏览器是否实现了某个feature,如果实现了那么开发人员就可以充分利用这个feature做一些工作,反之没有实现开发人员也好提供一个fallback.所以,我们要明白的 ...
- modernizr.js的介绍和使用
原文链接:https://www.cnblogs.com/-simon/p/5907053.html Modernizr帮助我们检测浏览器是否实现了某个feature,如果实现了那么开发人员就可以充分 ...
- 前端初学者——初探Modernizr.js Modernizr.js笔记
什么是Modernizr? Modernizr 是一个用来检测浏览器功能支持情况的 JavaScript 库. 目前,通过检验浏览器对一系列测试的处理情况,Modernizr 可以检测18项 CSS3 ...
- 使用Modernizr探测HTML5/CSS3新特性(转载)
转载地址:http://www.cnblogs.com/TomXu/archive/2011/11/18/detecting-html5-css3-features-using-modernizr.h ...
- [转]Modernizr的介绍和使用
转载自:http://blog.chinaunix.net/uid-21633169-id-4286857.html 传统浏览器目前不会被完全取代,令你难以将最新的 CSS3 或 HTML5 功能嵌入 ...
随机推荐
- (六)、nodejs中的express框架获取http参数
express获取参数方法: 一.通过req.params app.get('/user/:id', function(req, res){ res.send('user ' + req.params ...
- 获取屏幕分辨率(C/C++)
C/C++获取屏幕分辨率的方法 int main(int argc, char* argv[]) { // 需要添加头文件: // #include <Windows.h> system( ...
- mysql 导入导出数据库、数据表
Linux下 均在控制台下操作. 导入数据库: 前提:数据库和数据表要存在(已经被创建) (1)将数据表 test_user.sql 导入到test 数据库的test_user 表中 [root@te ...
- IntentService 串联 按顺序执行(此次任务执行完才执行下一个任务)
IntentService与Service的最大区别就是前者依次执行,执行完当前任务才执行下一个任务,后者并发执行 在IntentService里面不写onCreate方法 MainActivity: ...
- ios view的frame和bounds之区别(位置和大小)
前言: 学习ios开发有一段时间了,项目也做了两个了,今天看视频,突然发现view的frame和bound两个属性,发现bound怎么也想不明白,好像饶你了死胡同里,经过一番尝试和思考,终于弄明白bo ...
- .Net码农学Android---小点整理
小点整理 虽然两大语言的编程思想相同,语法也相似,但具体到使用时,还是有些别扭,可能还是不太熟悉,现就自己遇到的一些微小问题整理如下: String/Int转换 C#:String--->Int ...
- 分布式缓存Memcached
分布式缓存服务器,既然用到数据缓存很明显就是想高效性的获取数据,大容量的存储数据.为了可以缓存大量的数据以及可以高效获取数据,那么分布式缓存数据库就要解决数据可以水平线性扩展,这样可以扩大数据容 ...
- ORA-14099 错误解决
DB: 11.2.0.3.0 在测试把普通表修改为交换分区的时候,出现ORA-14099: all rows in table do not qualify for specified partiti ...
- CentOS6.4上搭建hadoop-2.4.0集群
公司Commerce Cloud平台上提供申请主机的服务.昨天试了下,申请了3台机器,搭了个hadoop环境.以下是机器的一些配置: emi-centos-6.4-x86_64medium | 6GB ...
- 2天驾驭DIV+CSS (基础篇)(转)
这是去年看到的一片文章,感觉在我的学习中,有不少的影响.于是把它分享给想很快了解css的兄弟们. 基础篇[知识一] “DIV+CSS” 的叫法是不准确的[知识二] “DIV+CSS” 将你引入两大误区 ...