Jump to content
Sign in to follow this  
brunomartins

Canvas

Recommended Posts

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>

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.