在创建HTML5 Canvas元素之前，首先要检测浏览器是否能够拿支持他，如果不支持，就要用文字或图片替代，检测代码如下所示。

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <!--[if IE]<script type="text/javascript" src="../js/excanvas.js" ></script><![endif]-->

    </head>

    <body>

        <div id="support"></div>

    </body>

    <script type="text/javascript">

        try{

            document.createElement("canvas").getContext("2d");

            document.getElementById("support").innerHTML = "当前浏览器支持HTML5 Canvas";

        }catch(e){

            document.getElementById("support").innerHTML = "当前浏览器不支持HTML5 Canvas";

        }

    </script>

</html>

其中“<!--[if IE]<script type="text/javascript" src="../js/excanvas.js" ></script><![endif]-->”是使IE浏览器兼容canvas的插件。

HTML5 Canvas 代码检测浏览器是否支持的更多相关文章

  1. 移动Web开发，4行代码检测浏览器是否支持position:fixed

    不废话,直接上代码 var div = document.createElement('div'); div.style.cssText = 'display:none;position:fixed; ...

  2. WebSocket API使用篇检测浏览器是否支持WebSocket(4)

    WebSocket API是下一代客户端-服务器的异步通信方法.前面有三篇文章已经对WebSocket有了一些介绍,这里我总结了一下.我在使用WebSockets API过程中遇到的问题. 1.检测浏 ...

  3. js检测浏览器是否支持某属性

    以检测浏览器是否支持 input 标签的 required 属性为例: var isSupport = 'required' in document.createElement('input');

  4. 检测浏览器是否支持cookie方法

    cookie 摘自: http://www.cnblogs.com/fish-li/archive/2011/07/03/2096903.html Cookie是什么? Cookie 是一小段文本信息 ...

  5. 代码验证浏览器是否支持html audio 和video

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  6. 检测浏览器是否支持某个css属性

    以浏览器是否支持translate3d 为例说明,当然现代浏览器已经支持该属性.如果浏览器实现了带有前缀的某个属性,比如说支持-webkit-transform,但是不支持直接写transform,可 ...

  7. 检测浏览器是否支持AJAX

    <script type="text/javascript"> function ajaxFunction() { var xmlHttp; try { // Fire ...

  8. 检测浏览器是否支持cookie功能

    <script> if(navigator.cookieEnabled) { document.write("你的浏览器支持cookie功能!"); } else{ d ...

  9. 检测浏览器是否支持range

    昨天的滑块建立在Input range这个基础上  这是IOS5.0及以后才支持的,而且在android2.3以下表现也不对 昨天的检测方式 var input = document.createEl ...

随机推荐

  1. Oracle数据库误删文件导致rman备份报错RMAN-06169解决办法

    Oracle数据库误删文件导致rman备份报错RMAN-06169解决办法 可能是误删文件导致在使用rman备份时候出现以下提示 RMAN-06169: could not read file hea ...

  2. TFIDF练习

    直接上代码吧: """ 测试Demo """ import lightgbm as lgb import numpy as np from ...

  3. Lightoj 1003 - Drunk（拓扑排序判断是否有环 Map离散化）

    题目链接:http://lightoj.com/volume_showproblem.php?problem=1003 题意是有m个关系格式是a b:表示想要和b必须喝a,问一个人是否喝醉就看一个人是 ...

  4. mysql数据库建模Navicat

    用Navicat制作ER图及与SQL互相转化 http://wangbaiyuan.cn/sql-and-use-navicat-to-make-er-diagram-and-interactive. ...

  5. mysql 数据操作 单表查询 concat_ws() 定义显示格式

    有个需求用concat以这种格式打印查询 mysql> select concat(name,':',age) from employee; +----------------------+ | ...

  6. Spring中基于Java的配置@Configuration和@Bean用法

    spring中为了减少xml中配置,可以声明一个配置类(例如SpringConfig)来对bean进行配置. 一.首先,需要xml中进行少量的配置来启动Java配置: <?xml version ...

  7. KL与JS散度学习[转载]

    转自:https://www.jianshu.com/p/43318a3dc715?from=timeline&isappinstalled=0 https://blog.csdn.net/e ...

  8. PAT 1105 Spiral Matrix[模拟][螺旋矩阵][难]

    1105 Spiral Matrix(25 分) This time your job is to fill a sequence of N positive integers into a spir ...

  9. cocos代码研究（21）Widget子类Text，TextAtlas，TextBMFont学习笔记

    理论基础 Text类又称ttf格式文本,可以用ttf文件或者系统自带字体,支持文字多,但是ttf文件格式体积大,渲染速度慢: TextBMFont类又称fnt格式文本,纹理创建,根据纹理上有的文字来显 ...

  10. node核心：异步流程控制

    Node.js的异步是整个学习Node.js过程中重中之重. 1)异步流程控制学习重点 2)Api写法:Error-first Callback 和 EventEmitter 3)中流砥柱:Promi ...