大魚顯示不出來,將ctx1改成ctx2才顯示
這是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是重疊在一起的
2018-05-28
將CSS代碼嵌入到HTML代碼中就可以了,為什么使用<link>將CSS鏈接到HTML文件中兩個canvas就不重疊?