Canvas
Pf alguem sabe mexer com canvas?
Alguem pode me dizer como mudar a cor de um quadrado quando colocado em cima de outro quadrado?
Esta aqui o codigo...
<!DOCTYPE HTML>
<html>
<head>
<style>
.tool-bar{
width: 40px;
right: 100px;
color: #7F2E0F;
height: 100%;
}
div.demo {
background: brown;
border: 1px solid #666;
margin-top: 0px;
margin-left: 1300px;
position: absolute;
width: 50px;
height: 618px;
overflow: auto;
}
#circulo{
width: 50px;
height: 50px;
}
</style>
<script type="text/javascript" src="assets/js/kinetic-v5.1.0.min.js"></script>
<script type="text/javascript" src="assets/js/fabric.min.js"></script>
</head>
<body>
<div class="demo">
<a href="#" ><img src="assets/images/resource-item.png" id="circulo"></a>
</div>
<div id="container"></div>
<canvas id="c4" width="1250" height="620" ></div>
<script>
var canvas = new fabric.Canvas('c4');
canvas.add(new fabric.Rect({ left: 90,top: 90, fill: 'green', width: 50, height: 50 }));
canvas.add(new fabric.Rect({ left: 1100, top: 50, fill: 'red', width: 30, height: 30 }));
canvas.add(new fabric.Rect({ left: 1100, top: 90, fill: 'blue', width: 30, height: 30 }));
canvas.item(0).hasControls = canvas.item(0).hasBorders = false;
canvas.item(1).hasControls = canvas.item(1).hasBorders = false;
canvas.item(2).hasControls = canvas.item(2).hasBorders = false;
canvas.item(0).selectable = false;
this.__canvases.push(canvas);
</script>
</body>
</html>Discussão (0)
Carregando comentários...