Jump to content
Search Community

Sliding door?

Jerrys test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hello Jerrys, and Welcome to the GreenSock forum!

Do you have an code example or demo example of what you have tried or what your trying to do, I am a little confused on your question?

 

If your just doing like a sliding door you can use animate scaleX and set the transformOrigin to 0% 50% so it slide from the left.

 

See the Pen qNzOqw?editors=0110#0 by jonathan (@jonathan) on CodePen

 

If this does not answer your question feel free to create a codepen example. Here is a video tut on how to create a codepen example.



This way we can test your code live on codepen to better help you!

Thanks! :)
  • Like 1
Link to comment
Share on other sites

Just imagine a door that slides inside a frame that is concealed before you slide it closed.  So when it is half done, you only see half the door.  I never should have mentioned scaling.  I'm just wondering broadly how to do that.  I'm pretty sure I could work out the details.   Maybe somebody has a clever idea.

 

Can I use z value effectively with gsap to determine which <div>s are on top?  Or, in my sliding door example, on bottom?

 

Link to comment
Share on other sites

That is weird why you don't see it working .. i tested it on Windows 10 and Windows 7 in latest Chrome, Firefox, IE11 and Edge. I even tested it on Mobile Chrome latest Android and Mobile Chrome build and i see it workling.

 

The pen that Joe forked was from my original codepen above.

 

See the Pen qNzOgE by jonathan (@jonathan) on CodePen

 

Mine looks the same, except it animates faster since it s duration is 0.6 instead of 1 second.. but the effect is the same even though one animates x and the other scaleX

 

Do you see my codepen working joe_midi if your still out there?

 

Thanks!

 

:)

Link to comment
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.
×
×
  • Create New...