archimedo Posted October 24, 2020 Share Posted October 24, 2020 Hi everyone, I'm making a website portfolio and I'd like to animate it with GSAP. In the codepen above there's the progress of my work, another user helped me to figure out how to animate the divs when opening an element. The thing is that I'd like the content of the page (when a project is opened) to smoothly appear, instead of coming into view suddnenly. I made a simple sketch to explain how I imagine this animation. Can you help me understand how to achieve that? Thank you very much! See the Pen rNLMdgd by archemede (@archemede) on CodePen Link to comment Share on other sites More sharing options...
ZachSaucier Posted October 24, 2020 Share Posted October 24, 2020 Hey archimedo. I see that you're currently toggling a class that affects the display of the child content. What you should also be doing (in addition to changing the display) is animating the opacity or autoAlpha of the content. A .from() tween would likely be helpful here so it ends up at the "normal" values. Unfortunately we don't have the capacity to help you out with your entire project - that's why we request that people provide minimal demos of their issue where only the code relevant to the question being asked is provided. I do think that these resources would be of great value to you though: The most common GSAP mistakes Tips for writing animation code efficiently Happy tweening! Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now