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

王朝学院·作者佚名  2016-05-24
窄屏简体版  字體: 小  |  中  |  大  |  超大  

使ie9以下版本支持canvas,CSS3等主流html5技术的方法1.前言。 ie6,7,8支持html5,看起来比较难,其实有一种方法很通用,就是引入js和css,这种可插拔的引入对开发很有帮助。比如,下面是一个让网页支持canvas和css3的例子。2.例子。下面是一个在canvas画布中显示一个红球的例子的html.java代码<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN"><HTML><HEAD><TITLE>fewfwe</TITLE><head><styletype="text/css">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:20pxauto;box-shadow:0040px#222;behavior:url(public/ie-css3.htc);}</style><scripttype="text/Javascript">functiontest(){varctx=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;</script></head><body><!--[ifIE]><scriptsrc="public/html5.js"type="text/javascript"></script><scripttype="text/javascript"src="public/excanvas.compiled.js"></script><![endif]--><canvasid="cv"></canvas></body>这个例子在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)

 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
© 2005- 王朝網路 版權所有 導航