move in image from bottom

[initium]

Hey,

I want to do this animation on the right hand side, where the picture comes in from the bottom and overlaps the old one. How could i do this?

[Shaun Gorneau]

Hi @initium,

 

Moving an image from the bottom can be handled by translating the image on the Y axis from either

 

1. off below (meaning the height of the viewable area) the viewable area to 0 or
2. on the viewable area (0) to off the top (minus the height of the viewable area).

 

Here is a verbose example to show you what I mean.

 

See the Pen oNoodpo?editors=0010 by sgorneau (@sgorneau) on CodePen.

 

In a practical execution you'd want to compute things like the viewable area height and wrap the timeline buildout in logic to accommodate any number of slides and any variation on height/width.

 

Hope this helps!

 

Shaun

 

 

[initium]

Got it thanks!

[Shaun Gorneau]

You're welcome!