canvas兼容低版本(<９)IE, 大概如下.Canvas是HTML5新增加的元素, 可以方便的画图. Firefox, safari, chrome, opera的最近版本以及IE9都支持. IE8及以下不支持HTML5, 但是ExplorerCanvas库(http://excanvas.sourceforge.net/)调用IE内部功能提供了几乎相同的API. ExplorerCanvas不支持字体, 所以为了使用文字, 还需要使用canvas-text库(http://code.google.com/p/canvas-text/).使用ExplorerCanvas及canvas-text, 需要在HTML header里包括:
<script type="text/javascript" src="javascript/excanvas/excanvas.js"></script>
<script type="text/javascript" src="javascript/excanvas/canvas.text.js"></script>
<script type="text/javascript" src="javascript/excanvas/faces/optimer-normal-normal.js"></script>如果同一页HTML要兼容低版本IE和其它支持HTML5的浏览器, 可以用如下的语法选择性加入低版本IE需要的部分:
<!--[if IE]>
<script type="text/javascript" src="javascript/excanvas/excanvas.js"></script>
<script type="text/javascript" src="javascript/excanvas/canvas.text.js"></script>
<script type="text/javascript" src="javascript/excanvas/faces/optimer-normal-normal.js"></script>
<![endif]--> 下面的部分包括在HTML的BODY里, canvas元素的后面:
<!--[if ! IE]>--> <script type="text/javascript" src="javascript/mycode.js"></script> <!--<![endif]-->
<!--[if IE]> <script type="text/javascript" src="javascript/mycode.ie.js"></script> <![endif]-->下面是mycode.ie.js不同于mycode.js的部分. 1. addEventListener -> attachEvent
别的浏览器用addEventListener. IE用attachEvent. 对于事件名, IE要多加一个"on". 比如IE用"onmousedown", 别的浏览器用"mousedown". 2. 为了兼容手机, 鼠标事件为触屏事件取代, 所以mousedown/mouseup/mousemove改用如下的事件: touchstart/touchend/touchmove.3. event.pageX -> pageX(event)
别的浏览器直接用event.pageX. IE完全不同, 所以另外自定义一个函数pageX(event)来达到相同效果:
function pageX(e) {
if (e.pageX) return e.pageX;
else if (e.clientX)
return e.clientX + (document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft);
else return null;
}4. in event handlers, this.offsetLeft/Top -> vCanvas.offsetLeft/Top
别的浏览器this指代事件发生的元素, 这里是canvas. IE的this指代window, 所以要专门指明vCanvas.offsetLeft/Top.5. onmouseout在IE里行为不稳定, 所以应避免使用, 或者改用onmouseleave.6. 辨认鼠标的左右键, 别的浏览器用event.which, IE用event.button.7. 另外IE引擎慢一些, 所以别的浏览器里运行流畅的canvas事件, 在IE里要简略一些来保证运行速度.时间有限, 暂时写这一些.
<script type="text/javascript" src="javascript/excanvas/excanvas.js"></script>
<script type="text/javascript" src="javascript/excanvas/canvas.text.js"></script>
<script type="text/javascript" src="javascript/excanvas/faces/optimer-normal-normal.js"></script>如果同一页HTML要兼容低版本IE和其它支持HTML5的浏览器, 可以用如下的语法选择性加入低版本IE需要的部分:
<!--[if IE]>
<script type="text/javascript" src="javascript/excanvas/excanvas.js"></script>
<script type="text/javascript" src="javascript/excanvas/canvas.text.js"></script>
<script type="text/javascript" src="javascript/excanvas/faces/optimer-normal-normal.js"></script>
<![endif]--> 下面的部分包括在HTML的BODY里, canvas元素的后面:
<!--[if ! IE]>--> <script type="text/javascript" src="javascript/mycode.js"></script> <!--<![endif]-->
<!--[if IE]> <script type="text/javascript" src="javascript/mycode.ie.js"></script> <![endif]-->下面是mycode.ie.js不同于mycode.js的部分. 1. addEventListener -> attachEvent
别的浏览器用addEventListener. IE用attachEvent. 对于事件名, IE要多加一个"on". 比如IE用"onmousedown", 别的浏览器用"mousedown". 2. 为了兼容手机, 鼠标事件为触屏事件取代, 所以mousedown/mouseup/mousemove改用如下的事件: touchstart/touchend/touchmove.3. event.pageX -> pageX(event)
别的浏览器直接用event.pageX. IE完全不同, 所以另外自定义一个函数pageX(event)来达到相同效果:
function pageX(e) {
if (e.pageX) return e.pageX;
else if (e.clientX)
return e.clientX + (document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft);
else return null;
}4. in event handlers, this.offsetLeft/Top -> vCanvas.offsetLeft/Top
别的浏览器this指代事件发生的元素, 这里是canvas. IE的this指代window, 所以要专门指明vCanvas.offsetLeft/Top.5. onmouseout在IE里行为不稳定, 所以应避免使用, 或者改用onmouseleave.6. 辨认鼠标的左右键, 别的浏览器用event.which, IE用event.button.7. 另外IE引擎慢一些, 所以别的浏览器里运行流畅的canvas事件, 在IE里要简略一些来保证运行速度.时间有限, 暂时写这一些.
关于"电脑在无路可走时会不断的重复走以前的几步", 有时间会改进.
高级的只赢了几次，这一次居然把程序给困惑住了，白棋不给走棋了
大神，我也喜欢HTML5
不想说什么,用Chrome版本 28.0.1500.72 m第一次完不了,每一次都下载背景音乐,如果一个游戏不兼容Chrome的话,我觉得没啥意义了,在IE10上卡的不行,真不知道楼上都玩了没