您的位置:首页 > Web前端 > JavaScript

createjs初学-简单的图片拖拽

2015-07-22 11:14 686 查看
在createjs中实现拖拽特别简单,基本上就是侦听一个pressmove事件就可以了

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script src="script/easeljs-0.8.1.min.js"></script>
<title>dragtest</title>
</head>
<body>
<canvas id="dragCanvas" width="600" height="400"></canvas>
<script>
var stage=new createjs.Stage("dragCanvas");
createjs.Ticker.setFPS(30);
createjs.Ticker.addEventListener("tick",stage);

var image=new createjs.Bitmap("images/test.jpg");
stage.addChild(image);

var oldX;
var oldY;
image.addEventListener("mousedown",function(e){
oldX= e.stageX;
oldY= e.stageY;
});
image.addEventListener("pressmove", function (e) {
e.target.x+= e.stageX-oldX;
e.target.y+= e.stageY-oldY;
oldX= e.stageX;
oldY= e.stageY;
});
</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  createjs