html5 canvas - Why kineticJS cannot move workings with touch or mouse? -
i need move "box" group while touching or mousemoving inside white-part of screen.
<script defer="defer"> var stage = new kinetic.stage({ container: 'fullscreendiv', width: 1180, height: 664 }); var layer = new kinetic.layer(); var gamepart = new kinetic.rect({ x: 0, y: 0, width: 1180, height: 500, stroke: 'black', strokewidth: 4 }); var statuspart = new kinetic.rect({ x: 0, y: 500, width: 1180, height: 164, fill: 'blue', stroke: 'black', strokewidth: 4 }); var group = new kinetic.group({ draggable: true, dragboundfunc: function(pos) { return { x: pos.x, y: this.getabsoluteposition().y } } }); window.addeventlistener('keydown', function(e) { if (e.keycode == 37) //left arrow key moveboxes(-10); if (e.keycode == 39) //right arrow key moveboxes(10); stage.draw(); }); function moveboxes(pixels) { group.x(group.x() + pixels); stage.draw(); } var oldpos = null; var touchpos = null; gamepart.on('touchmove mousemove', moving(stage.getpointerposition())); function moving(mousepos){ if(!oldpos) oldpos = stage.getpointerposition(); touchpos = mousepos; var x = touchpos.x - oldpos.x; moveboxes(x); } </script>
the group containing boxes have added. working fine move key-arrows , page can found @ webpage
i think want use function
'touchmove mousemove'
events, neither result of function.
gamepart.on('touchmove mousemove', function() { moving(stage.getpointerposition()) });
Comments
Post a Comment