Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
LeoZ

Div and image should start expanding from button position after clicking on plus button

Recommended Posts

Hello all,

Is there any way if we can create the animation effect shown in the following link: https://uimovement.com/design/beaches-app/

I have saw some examples (https://greensock.com/forums/topic/14206-full-screen-a-div/)  for the same effect but I'm not able to use timeline correctly I guess.

 

Can someone help me please?

 

 

See the Pen WVpVVR by LeoZoe (@LeoZoe) on CodePen

Share this post


Link to post
Share on other sites

I think you asked the same question last week.

If you have a specific GSAP related problem or question we're happy to help, but we can't dive in and create entire projects. In your original thread @ZachSaucier linked to another thread which should be helpful:

Here are a couple more:

You can also use the forum search feature to find additional accordion threads. If you have GSAP questions/problems as you progress, we're happy to help.

 

Happy tweening.

  • Like 3

Share this post


Link to post
Share on other sites

Thank you Craig for sharing these threads but they all are simple accordion examples. I already search for threads similar to my animation (one link shared in description). But when I tried the same thing it was not working correctly with my example. So I was curious to know how I can use GS for my example. 

Threads you shared are very simple accordion examples and I can create better than those. But the beach example looks very cool and I will try to create that myself. Thanks though for sharing and your time.

 

Share this post


Link to post
Share on other sites

Yeah, I really wish we had the resources to help with whole projects. My advice is to make just one div behave as you'd like and then add additional elements into the accordion. Always start small and build from there.

 

If you have GSAP related problems or questions, we're happy to help. Happy tweening.

  • Like 3

Share this post


Link to post
Share on other sites

Hey @LeoZ,

 

Just for fun - a simple version ...

 

See the Pen KOQjMw by mikeK (@mikeK) on CodePen

 

Happy tweening ...

Mikel

  • Like 4

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×