responsive mouseover parallax ?

[gaborb32578318]

Hi Guys,

Can you offer me a responsive mouseover parallax sript for animate?

I use this, but this is no responsive 😞

https://youtu.be/vrr9HaKm2yk

Thanks
G.

[kglad]

what problem are you having?

[gaborb32578318]

The published project is not responsive.
Or I dont know. May be the problem is that the lookable screen smaller than the real horisontal image, because it is use the parallax effect?

[kglad]

as3 or html5?

what code are you using for the parallax effect.  (ie, don't copy/paste all your code.)

any error messages?

[JoãoCésar · Accepted solution]

Hi.

I have a solution for you using the built-in camera tool. The advantage of this approach is that you can use raw shapes and bitmaps without worrying about containers and instance names, you can adjust the depth using the Layer Depth panel, and the code is easier to understand, I think.

Please notice that I turned most of the layers into bitmaps because the original file was to heavy.

Create timeline layers with Animate CC

Camera in Animate CC

JavaScript code:

var cam = AdobeAn.VirtualCamera.getCamera(exportRoot);
function lerp(v1, v2, friction)
{
     return friction * v1 + (1 - friction) * v2;
}
createjs.Ticker.on("tick", function(e)
{
     cam.setPosition(lerp(cam.getPosition().x, canvas.width * 0.5 - stage.mouseX, 0.9), 0, 0);
});

FLA download:

animate_cc_html5_canvas_parallax_effect.zip - Google Drive

Regards,

JC