使用图层(zIndex)在画布中设置背景 [英] Set the background in canvas using layer (zIndex)
本文介绍了使用图层(zIndex)在画布中设置背景的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要使用图层在画布上获取背景.它的背景是可变的.我知道我应该使用CSS并设置z-index,但是在这种情况下不知道该怎么做.
I need to get a background on canvas using layers. Variable for it's background. I know I should use CSS and set the z-index, but do not know how to do it in this case.
JS:
function doFirst(){
var x = document.getElementById('canvas');
canvas = x.getContext('2d');
var item1 = new Image();
item1.src = "images/sheep.png";
item1.addEventListener("load", function() { canvas.drawImage(item1,20,300)}, false);
var item2 = new Image();
item2.src = "images/tshirt.png";
item2.addEventListener("load", function() { canvas.drawImage(item2,300,300)}, false);
var background = new Image();
background.src = "images/background.png";
background.addEventListener("load", function() { canvas.drawImage(background,0,0,1024,768)}, false);
}
HTML:
<canvas id="canvas" width="1024" height="768">
推荐答案
Canvas元素并非旨在解决该元素中的图层,您需要使用多个canvas元素来解决问题.
The Canvas element is not designed to address layers within the element, you'll need to approach your problem using multiple canvas elements instead.
这篇关于使用图层(zIndex)在画布中设置背景的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文