今天在练习的时候照着视频敲了段代码结果运行结果不是这么回事，于是苦苦寻找半天没能解决，

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><scripttype="text/javascript"src="http://libs.baidu.com/jquery/1.4.2/jquery.min.js"></script></head><body><canvasid="canvas"width="640"height="480"></canvas></body><script>varContext={canvas:null,context:null,create:function(canvas_tag_id){this.canvas=document.getElementById(canvas_tag_id);this.context=this.canvas.getContext("2d");returnthis.context;}};varSprite=function(filename,is_pattern){this.p_w_picpath=null;this.pattern=null;this.TO_RADIANS=Math.PI/180;if(filename!=undefined&&filename!=""&&filename!=null){this.p_w_picpath=newImage();this.p_w_picpath.src=filename;if(is_pattern)//createPattern//console.log("thisisapattern");this.pattern=Context.context.createPattern(this.p_w_picpath,"repeat");//returnthis.pattern;//此处赋值bug,火狐中正常，谷歌中错误}else{console.log("unabletoloadsprite");}this.draw=function(x,y,w,h){//if(this.pattern!=null){//console.log("patternisnotnull");Context.context.fillStyle=this.pattern;Context.context.fillRect(x,y,w,h);}else{//if(w!=undefined||h!=undefined){Context.context.drawImage(this.p_w_picpath,x,y,this.p_w_picpath.width,this.p_w_picpath.height);}else{Context.context.drawImage(this.p_w_picpath,x,y,w,h);}}};this.rotate=function(x,y,angle){Context.context.save();Context.context.translate(x,y);Context.context.rotate(angle*this.TO_RADIANS);Context.context.drawImage(this.p_w_picpath,-(this.p_w_picpath.width/2),-(this.p_w_picpath.height/2));Context.context.restore();};}//varimg=newSprite("wall.png",false);$(document).ready(function(){//InitalizeContext.create("canvas");varWALL="http://www.tigrisgames.com/wall.png";varCRATE="http://www.tigrisgames.com/crate.png";varpattern=newSprite(CRATE,true);varp_w_picpath=newSprite(WALL,false);varp_w_picpath3=newSprite(CRATE,false);varangle=0;setInterval(function(){Context.context.fillStyle="#000000";Context.context.fillRect(0,0,800,800);pattern.draw(160,160,256,180);p_w_picpath.draw(0,0,64,64);p_w_picpath.draw(0,74.256,32);p_w_picpath.rotate(115,160,angle+=4.0);p_w_picpath3.rotate(115,260,-angle/2);},50)/*Context.context.beginPath();Context.context.rect(0,0,640,480);Context.context.fillStyle="black";Context.context.fill();*/});</script></html>


应该是上图的结果，而在谷歌浏览器中却没有平铺形成了如下的结果。

不知道为什么会是这样的结果。