老师说 是浏览器刷新帧数的问题

没有new Image吧？

我也有这个问题，然后发现是canvas那里获取元素写错了，两个获取的都是can1

mian里的执行顺序的问题正确的是

drawBackground();
fruitMonitor();
fruit.draw();
mom.draw();

666

是不是图片没有加载进来,也就是图片路径错误 应该是当前目录下的img文件./img/bigEye0.png

第一行的大鱼两个字后面加个回车行不行，你把它注释掉的

多粘贴一点代码呀

直接发代码给你看看

方法要执行才可以

先保存当前画笔的状态save(),再恢复restore()状态,在这之间的，有要旋转画笔，移动画布圆点的操作都不会影响到画布中其他的图形的绘制

```````````````````````````````````````

答案 ······················                    

已解决  在HTML文件中将z-index:1;写成了z-index:1px

有没有大神说下1和1px的区别呢？

把main.js中这句代码注释掉看看：ctx1.clearRect(0, 0, canWidth, canHeight)  

this.bigEye.src = "/img/bigEye0.png";

this.bigBody.src = "/img/bigSwim0.png";

this.bigTail.src = "/img/bigTail0.png";

这个好像有问题，少
加了. 吧

你改成这样试试看

this.bigEye.src = "./img/bigEye0.png";

this.bigBody.src = "./img/bigSwim0.png";

this.bigTail.src = "./img/bigTail0.png";

babyObj.prototype.draw = function () {
   // ctx1

   this.x = lerpDistance(mum.x, this.x, 0.98);
   this.y = lerpDistance(mum.y, this.y, 0.98);

   //delta angle
   var deltaY = mum.y - this.y;
   var deltaX = mum.x - this.x;
   var beta = Math.atan2(deltaY,deltaX) + Math.PI;

   this.angle = lerpAngle(beta,this.angle,0.6);

   ctx1.save();

   ctx1.translate(this.x, this.y);
   ctx1.rotate(this.angle);
   ctx1.drawImage(this.babyTail, -this.babyTail.width*0.5+23, -this.babyTail.height*0.5);
   ctx1.drawImage(this.babyBody, -this.babyBody.width*0.5, -this.babyBody.height*0.5);
   ctx1.drawImage(this.babyEye, -this.babyEye.width*0.5, -this.babyEye.height*0.5);

   ctx1.restore();
}

解决了，画布图层关系z-index不对！

如果和老师写的一样的话，我是通过把canWidth和canHeight换成800,600就可以了，我打印canWidth出来的结果是NaN,所以我猜那个canWidth可能是带有px那个吧你可以试试

代码发出来看一下呀

不可以的，图片需要是透明的，JPG没办法背景透明

看看你的css里面 cxt1 的z-index 是不是比 cxt2 的大 ；

按照教程是  cxt1 是1 ；cxt2 是0；

贴代码呀

没有在index引入 mom.js? 

已经解决： canvas  只能使用 行内样式，并且不能带单位，否则图像变形。

context.translate(x,y)函数可以使画布的原点坐标变为(x,y)，即画笔从这个点开始画。因为我们画完一部分内容之后希望重新定义画笔的属性，所以用context.save()和context.restore()包裹例如context.translate(),context.fillStyle等属性设定。希望能帮助你理解

ctx1.drawImage(this.bigEye, -this.bigEye * 0.5, -this.bigEye * 0.5);  

写错了，应该是 

ctx2.drawImage(this.bigEye, -this.bigEye.width * 0.5, -this.bigEye.height * 0.5);

额····这个主要是看你代码到底怎么打的了，我个人猜的，你要是在main中声明了momObj为联系mom.js文件内容（momObj=new momObj();），只需要在init后面加上()就应该可以了,详细的不看你全代码，说不准······>.<

不用回答了，是我ctx1取值的时候取错了

额？什么已解决？

背景图上话动物