Screen Scaling and opacity animation

[Ahsan Jamal 2 Likes (Newbie)]

I want to animate the home page of my website like this one : http://discoveroutpost.com/

I am using GSAP TweenMax function but unable to get the smooth animation like this. I am also trying the ScrollMagic Library for it but still no luck. Please guide how can I achieve this. Thanks in advance.

[Shaun Gorneau 2,037 Likes (Superhero)]

This is fairly easily achieved without ScrollMagic ... you just create your scaling and moving timeline, pause it immediately and then use scroll (position/determined distance) to set the timeline's progress.

 

Here is a simple example

 

See the Pen jGKvVX by sgorneau (@sgorneau) on CodePen