Jump to content
Search Community

Default GreenSock Ease as a CSS Easing Function

GOLDPoint Systems test
Moderator Tag

Go to solution Solved by Diaco,

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 fellow developers,

 

I have tried to search this...but I have come up empty handed. I would like to know what the Cubic-Bezier for GreenSock's Power1.easeOut is. I've got an element that I'm using GreenSock for it's animation (because it's very complicated) and another element that I'm using CSS. However, I would like for their easing functions to match. I've attached the simple code pen with one being css and the other using greensock. As you can see, the standard ease-out value is close...but not close enough. 

 

Thanks,

Michael Richins

UI/UX Designer

GOLDPoint Systems

 

See the Pen wKRxPQ?editors=001 by MrGrigri (@MrGrigri) on CodePen

Link to comment
Share on other sites

  • Solution

Hi GOLDPoint Systems :)

 

as you can read in the Doc :

 

Provides an easeIn, easeOut, and easeInOut with a power (or strength) of 1 which is identical to Quad but with a more intuitive name. The more power, the more exaggerated the easing effect. Using a numeric approach like this in the name makes experimenting easier.

 
This is one of the eases that is natively accelerated in TweenLite and TweenMax. All of the "Power" eases and their counterparts (Linear (0), Quad (1), Cubic (2), Quart (3), Quint (4), and Strong (4)) are accelerated.
 
so pls try this :
transition: all .3s cubic-bezier(0.250, 0.460, 0.450, 0.940);
  • Like 2
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...