bertanha Posted January 9, 2014 Share Posted January 9, 2014 Hi, I'm trying to move an image but I can't <script src="kinetic-v4.7.4.min.js"></script> <script defer="defer"> var stage = new Kinetic.Stage({ container: 'container', width: 578, height: 200 }); var layer = new Kinetic.Layer(); var imageObj = new Image(); imageObj.onload = function() { var cup = new Kinetic.Image({ x: 200, y: 50, image: imageObj, width: 106, height: 118 }); // add the shape to the layer layer.add(cup); // add the layer to the stage stage.add(layer); }; imageObj.src = 'copo.png'; document.getElementById('show').addEventListener('click', function() { imageObj.move(10,10); layer.draw(); alert('2'); }, false); </script> Quote Link to comment Share on other sites More sharing options...
rich Posted January 10, 2014 Share Posted January 10, 2014 There are loads of examples on the Kinetic site. I would recommend finding one that is close to what you need and taking it, then start making small edits to it. Quote Link to comment Share on other sites More sharing options...
bertanha Posted January 10, 2014 Author Share Posted January 10, 2014 I can make it work, Code:<html> <head> <meta charset="utf-8"> <title>Prototype</title> <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> <script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.7.2.min.js"></script><style>body{padding:20px;}#container{ border:solid 1px #ccc; margin-top: 10px; width:350px; height:350px;}</style> <script>$(function(){ var stage = new Kinetic.Stage({ container: 'container', width: 350, height: 350 }); var layer = new Kinetic.Layer(); stage.add(layer); var yoda; var imageObj = new Image(); imageObj.onload = function() { yoda = new Kinetic.Image({ x: 200, y: 50, image: imageObj, width: 106, height: 118 }); layer.add(yoda); layer.draw(); } imageObj.src="copo.png"; document.getElementById('show').addEventListener('click', function() { yoda.move(0,5); layer.draw(); }, false);}); // end $(function(){});</script> </head><body> <button id="show">Move!</button> <div id="container"></div></body></html>thanks Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.