先画出3个图。然后点击红色 背景就变红 点蓝就变蓝 下面是代码。做到的我可以发红包或者加扣扣357772237
<canvas id="myCanvas" width="300" height="380"></canvas>
<style type="text/css">
#myCanvas {
position : absolute;
left :0px;
top:0px;
width:300px;
height:380px;
background-color:#CCFFCC;
}
</style>
<script type="text/javascript">
var canvasObj = document.getElementById("myCanvas");
var context = canvasObj.getContext("2d");
var x;
var y;
init_color();
function init_color(){
context.fillStyle = "rgb(255,0,0)";
context.fillRect(10,280,70,70);
context.fillStyle = "rgb(0,128,0)";
context.fillRect(110,280,70,70);
context.fillStyle = "rgb(0,0,255)";
context.fillRect(210,280,70,70);
}
function select(evt){
evt.preventDefault();
y = evt.touches[0].pageY;
x = evt.touches[0].pageX;

这是js代码，原理是一样的

对一个元素设置三个class名不同的样式(红、黄、蓝)，然后给这个元素默认一个class名（红），点击某个按钮之后用setAttribute改变它的class名（改成黄或蓝），之后会自动调用黄或蓝那两个class样式。思路我给你了，自己动手，丰衣足食