eroer
2018-05-28 11:37
这是CSS代码:
body{ padding: 20px;} .all_bg { display: inline-block; width: 800px; height: 600px; position: relative; } .all_bg .allCanvas { position: relative; width: 800px; height: 600px; margin: 0; } #canvas1 { position: absolute; top: 0; left: 0; z-index: 1; } #canvas2 { position: absolute; top: 0; left: 0; z-index: 0; }
大鱼的JS代码:
var bigFishObj = function(){ this.x; this.y; this.bigEye = new Image(); this.bigBody = new Image(); this.bigTail = new Image(); } bigFishObj.prototype.init = function(){ this.x = canWidth * 0.5; this.y = canHeight * 0.5; this.bigEye.src = "./src/bigEye0.png"; this.bigBody.src = "./src/bigSwim0.png"; this.bigTail.src = "./src/bigTail0.png"; } bigFishObj.prototype.drawImage = function(){ ctx1.save(); ctx1.drawImage(this.bigEye, this.x, this.y); ctx1.drawImage(this.bigBody, this.x, this.y); ctx1.drawImage(this.bigTail, this.x, this.y); ctx1.restore(); }
而且我的canvas1和canvas2不是重叠的,但是看老师演示两个canvas是重叠在一起的
将CSS代码嵌入到HTML代码中就可以了,为什么使用<link>将CSS链接到HTML文件中两个canvas就不重叠?
HTML5小游戏---爱心鱼(上)
92350 学习 · 551 问题
相似问题
回答 2
回答 3
回答 2
回答 3
回答 3