Key frames and mouse movement

[Ervin Petrisevac]

Hi everyone, this is my first time seeking help, this is my last resort

I am a designer by vocation, but i have some tasks from time to time to animate something, and my dev skills are not so good and i am fairly average at Animate (i have some Flash and Edge experience) but mostly at simple animations.

Now, i have a assignment to emulate object rotation, it consists of 72 still images that create rotational effect. I made it rotate (animating was no issue no issue, i arranged all key frames on same layer) but when a person comes with mouse over the animation it needs to emulate the rotation of the object from frame 1 to frame 72 depends if mouse goes left or right. I hope i wasn't confusing.

Thank you in advance !

[ClayUUID]

It would be helpful if you specified whether this is an AS3 or Canvas project.

[Ervin Petrisevac]

Sorry my bad, it is a Canvas project.

[kglad]

use the api here, EaselJS v0.8.2 API Documentation : EaselJS

but this will get you started. place a stage colored movieclip named cover over your stage and assign it an alpha of 1 and enable multiframe bounds

var tl = this;

tl.stop();

stage.enableMouseOver(10);

tl.cover.addEventListener('mouseover',moveF);

stage.addEventListener('mouseleave',stopF);

interpolateF(tl,20,1,stage.getBounds().width-20,72);

function stopF(e){

    createjs.Ticker.removeEventListener("tick", tickF);

}

function moveF(e){

    createjs.Ticker.addEventListener("tick", tickF);

}

function tickF(){

    tl.gotoAndStop(Math.round(tl.m*stage.mouseX+tl.b));

}

function interpolateF(obj,x1,y1,x2,y2){

    obj.m = (y1-y2)/(x1-x2);

    obj.b = y1-obj.m*x1;

}

[ClayUUID]

Why would you tell him to enable multiframe bounds? That's for clips that change shape over the course of the movie.

And what's the purpose of the cover clip? It should be possible to assign a mouse move listener directly to the stage.