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的更多相关文章

  1. Modernizr.js:为HTML5和CSS3而生!

    原文链接:http://caibaojian.com/modernizr-js.html modernizr这个JS,在国外的主题里面很多地方都看到,就只记得是为html补充的,有点类似与respon ...

  2. HTML5系列四(特征检测、Modernizr.js的相关介绍)

    Modernizr:一个HTML5特征检测库 Modernizr帮助我们检测浏览器是否实现了某个特征,如果实现了那么开发人员就可以充分利用这个特征做一些工作 Modernizr是自动运行的,无须调用诸 ...

  3. 前端的瑞士军刀:Modernizr.js

    前言 Modernizr.js既能给老版本浏览器打补丁,又能保证新浏览器渐进增强的用户体验. 作用: 从实际操作来看,Modernizr默认做的事情很少,除了(在你选择的情况下)给不支持html5的标 ...

  4. Modernizr.js入门指南(HTML5&CSS3浏览器兼容插件)

    HTML5 和 CSS3 的快速发展,给我们带来了极大的便利,比如从此再也不用花费大量的时间只是为了设计一个圆角的效果. 但是!我们不能像控制机器一样来控制所有的人都一夜之间升级到现代浏览器,因为那些 ...

  5. Modernizr.js介绍与使用

    Modernizr帮助我们检测浏览器是否实现了某个feature,如果实现了那么开发人员就可以充分利用这个feature做一些工作,反之没有实现开发人员也好提供一个fallback.所以,我们要明白的 ...

  6. modernizr.js的介绍和使用

    原文链接:https://www.cnblogs.com/-simon/p/5907053.html Modernizr帮助我们检测浏览器是否实现了某个feature,如果实现了那么开发人员就可以充分 ...

  7. 前端初学者——初探Modernizr.js Modernizr.js笔记

    什么是Modernizr? Modernizr 是一个用来检测浏览器功能支持情况的 JavaScript 库. 目前,通过检验浏览器对一系列测试的处理情况,Modernizr 可以检测18项 CSS3 ...

  8. 使用Modernizr探测HTML5/CSS3新特性(转载)

    转载地址:http://www.cnblogs.com/TomXu/archive/2011/11/18/detecting-html5-css3-features-using-modernizr.h ...

  9. [转]Modernizr的介绍和使用

    转载自:http://blog.chinaunix.net/uid-21633169-id-4286857.html 传统浏览器目前不会被完全取代,令你难以将最新的 CSS3 或 HTML5 功能嵌入 ...

随机推荐

  1. wordpress代理设置

    打开wp-config.php,在页首加上以下语句: define('WP_PROXY_HOST', '192.168.84.101'); define('WP_PROXY_PORT', '8080' ...

  2. Vue.js学习 Item11 – 组件与组件间的通信

    什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能.在有 ...

  3. Silverlight DataGrid数据行背景颜色控制

    sdk:DataGrid数据绑定后,部分特殊的行需要用不同的背景颜色来显示.(注册DataGrid的LoadingRow事件) private void radGridView_LoadingRow( ...

  4. reader,字符流

    1. public class Demo1 { public static void main(String[] args) throws IOException { File file = new ...

  5. delphi控件安装与删除

    附带通用控件安装方法:----------基本安装1.对于单个控件,Componet-->install component..-->PAS或DCU文件-->install;2.对于 ...

  6. SQL Server 基础:Case两种用法

    测试数据 1).等值判断->相当于switch case select S#,C#,C#=( case C# when 1 then '语文' when 2 then '数学' when 3 t ...

  7. 5.html5中的路径表示

    路径在html中的作用主要是进行外部资源的引入,如css文件,js文件,媒体文件等. 而路径本身有分为相对路径和绝对路径.所谓相对路径,就是相对于链接页面而言的另一个页面的路径.而绝对路径,就是直接从 ...

  8. ORACLE 单实例完全卸载数据库

    1.用oracle用户登录如果要再次安装, 最好先做一些备份工作.包括用户的登录脚本,数据库自动启动关闭的脚本,和Listener自动启动的脚本.要是有可能连创建数据库的脚本也保存下来 2.使用SQL ...

  9. oracle 日志文件管理

    OS: [root@b28-122 ~]# more /etc/oracle-releaseOracle Linux Server release 5.7 DB: SQL> select * f ...

  10. ASP.NET基础笔记

    MSDN:                                                                                                ...