在createjs中,影片剪辑TestMC内部嵌套影片剪辑samllWJD,按下鼠标samllWJD跟随移动,松开停止移动,代码重新编写
时间: 2024-11-14 15:23:44 浏览: 1
html5-whale_HTML网页动画鲨鱼_可跟随鼠标移动_whaleindex_
在CreateJS库中,特别是EaselJS模块,你可以通过监听鼠标事件并操作`Stage`对象来控制嵌套在`MovieClip`(这里是TestMC)内的另一个电影剪辑(smallWJD)。以下是基本的代码结构:
```javascript
// 假设TestMC和smallWJD已经加载并添加到舞台上
var stage = new createjs.Stage('canvas');
var TestMC = new MyTestMC(); // 假设MyTestMC是TestMC的实例
var smallWJD = new MySmallWJD(); // 假设MySmallWJD是smallWJD的实例
stage.addChild(TestMC);
TestMC.addChild(smallWJD);
// 添加鼠标事件监听
TestMC.addEventListener('mousedown', function(e) {
e.target.x = e.stageX; // 设置smallWJD的位置跟随鼠标位置
e.target.y = e.stageY;
});
TestMC.addEventListener('mouseup', function() {
// 松开鼠标后,移除小电影剪辑的移动监听,使其停止移动
smallWJD.stopAllSounds();
smallWJD.removeEventListener('update', moveSmallWJD); // 如果有定时移动动画,取消它
});
// 移动小电影剪辑的方法(这里假设有一个名为moveSmallWJD的方法)
function moveSmallWJD(event) {
smallWJD.x = event.target.x;
smallWJD.y = event.target.y;
}
// 更新舞台时会触发这个事件
stage.addEventListener('tick', function(event) {
if (smallWJD.parent === TestMC) { // 确保smallWJD还在TestMC中
moveSmallWJD(event);
}
});
```
阅读全文