javascript - 从 CreateJS/Animate 中的函数开始

Question

我是 Animate/CreateJS 新手，我想知道如何使其发挥作用。我想要的是，当我将鼠标悬停在一个对象上时，另一个对象的 alpha 值会从 0 变为 1。我搜索了谷歌，但找不到任何可以帮助我解决这个问题的东西。

代码是这样的:

var frequency = 3;
stage.enableMouseOver(frequency);
this.movieClip_1.addEventListener("mouseover", fl_MouseOverHandler);

function fl_MouseOverHandler()
{

// Execute movieclip 2 function

}


var movieClip_2_FadeInCbk = fl_FadeSymbolIn.bind(this);
this.addEventListener('tick', movieClip_2_FadeInCbk);
this.movieClip_2.alpha = 0;

   function fl_FadeSymbolIn()
   {
   this.movieClip_2.alpha += 0.01;
   if(this.movieClip_2.alpha >= 1)
   {
        this.removeEventListener('tick', movieClip_2_FadeInCbk);
   }
}

提前致谢。

Answer 1

您编写的代码离我们已经不远了。您有一个 alpha 淡入自动收报机，只需在想要开始淡入时添加滴答监听器即可。另请确保使用 .bind(this)当传入任何访问 this 的处理函数时在其中，否则你会遇到问题:

var frequency = 3;
stage.enableMouseOver(frequency);
this.movieClip_1.addEventListener("mouseover", fl_MouseOverHandler.bind(this));

function fl_MouseOverHandler() {
    this.addEventListener('tick', movieClip_2_FadeInCbk);
}

this.movieClip_2.alpha = 0;

var movieClip_2_FadeInCbk = fl_FadeSymbolIn.bind(this);
function fl_FadeSymbolIn() {
   this.movieClip_2.alpha += 0.01;
   if (this.movieClip_2.alpha >= 1) {
       this.removeEventListener('tick', movieClip_2_FadeInCbk);
   }
}

或者，您可以使用 Tween :

var frequency = 3;
stage.enableMouseOver(frequency);
this.movieClip_1.addEventListener("mouseover", fl_MouseOverHandler.bind(this));

this.movieClip_2.alpha = 0;

function fl_MouseOverHandler() {
    createjs.Tween.get(this.movieClip_2).to({alpha: 1}, 1000);
}