XJoeyV

Creating a Intro / Banner animation like this

Recommended Posts

I have got 100 tests and revisions over they last couple days but I still cannot make something that looks like: https://www.jetbrains.com/phpstorm/

 

The images and the text, is there any1 thay can explain me how to achieve something like that

Share this post


Link to post
Share on other sites

Welcome to the forum.

 

I'm not quite sure what we should be looking at on that website. You said you had 100 tests and revisions. Perhaps you can put one of them into a demo for us?

We don't have the resources to offer advice about entire websites, but we're happy to help if your question or problem is related to GSAP.

 

Happy tweening.

:)

 

  • Like 2

Share this post


Link to post
Share on other sites

 Hi,

 

Nope they are not commited or saved I worked in one file and Im now trying to reverse engineer there website.

It's about the part that is done via ScrollMagic and GSAP.

 

I mean the "Why PHPStorm" -> "ENJOY PRODUCTIVE PHP", the text and image animation are done via ScrollMagic and GSAP but I cannot figure out how due webpack and div soup. Can you give me the right directions.

Share this post


Link to post
Share on other sites

You're talking about that screen image that fades a few times as you scroll?

 

That can be accomplished with ScrollMagic pinning.

http://scrollmagic.io/examples/basic/simple_pinning.html

 

You could also use use CSS and set position to sticky.

https://developer.mozilla.org/en-US/docs/Web/CSS/position

 

If you put together a starter demo, we can probably point you in the right direction.

 

Happy tweening.

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.