视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
使ie9以下版本支持canvas,css3等主流html5技术的方法_html/css_WEB-ITnose
2020-11-27 15:54:33 责编:小采
文档


1.前言。
ie6,7,8支持html5,看起来比较难,其实有一种方法很通用,就是引入js和css,这种可插拔的引入对开发很有帮助。比如,下面是一个让网页支持canvas和css3的例子。
2.例子。
下面是一个在canvas画布中显示一个红球的例子的html.

Java代码

  1. fewfwe
  2. function test() {
  3. var ctx = document.getElementById("cv").getContext("2d");
  4. ctx.fillStyle = "#aa0000";
  5. ctx.beginPath();
  6. ctx.arc(100, 100, 25, 0, Math.PI*2, true);
  7. ctx.closePath();
  8. ctx.fill();
  9. }
  10. 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)
  • 下载本文
    显示全文
    专题