您好,欢迎访问一九零五行业门户网

使ie9以下版本支持canvas,css3等主流html5技术的方法_html/css_WEB-ITnose

1.前言。 
  ie6,7,8支持html5,看起来比较难,其实有一种方法很通用,就是引入js和css,这种可插拔的引入对开发很有帮助。比如,下面是一个让网页支持canvas和css3的例子。 
2.例子。 
下面是一个在canvas画布中显示一个红球的例子的html.
java代码  
nbsp;html public -//w3c//dtd html 4.0 transitional//en>            fewfwe              body {       background: #444;         color: #fff;        font-family: helvetica, arial, sans-serif;        text-align: center;    }        #cv {        width: 600px; height: 400px;        background: #000;       border-radius: 20px;        padding: 20px;        margin: 20px auto;       box-shadow: 0 0 40px #222;        behavior: url(public/ie-css3.htc);           }             function test() {   var ctx = document.getelementbyid(cv).getcontext(2d);            ctx.fillstyle = #aa0000;      ctx.beginpath();      ctx.arc(100, 100, 25, 0, math.pi*2, true);      ctx.closepath();      ctx.fill();    }       window.onload = test;                             
这个例子在ie8不能运行,火狐可以。如果要它能在ie6,7,8能运行,那么需要做两件事情。 
2.1增加一个html5的ie辅助js文件和一个canvas兼容js文件 
  这个文件可命名为html5.js,这是一个开源的js文件,可以放心使用,它主要是解决了了6,7,8兼容html5的js的问题。canvas兼容文件命名为excanvas.compiled.js,所有文件我已经打包在demo里面。可以下载。 
2.2.增加一个css文件和在页面进行引用。 
  css文件命名为ie-css3.htc,它解决了ie6,7,8,兼容css3的问题。 
3.demo下载。 
见附件。 
4.例子运行结果 
见下面这张图片。是一个红色的圆圈,显示在黑色的画布上面。
5.总结 
   ie6,7,8 兼容其他html5技术的做法,其实都可以效仿引用js和css的做法。这样,便为html5在移动端驰骋,扫清了最后一丝障碍。
test21.rar (13.6 kb)
其它类似信息

推荐信息