Übertrieben CSS-Übergang in die Höhe

Question

Wie würde ich den übertriebenen Übergang in die Höhe erreichen können, wie im Drop-down-Menü Übergang this website zu sehen ist? Normal CSS transitions sind viel linearer als das, was ich hier gesehen habe. Vielen Dank!

Answer 1

Sie können Ihre eigenen benutzerdefinierten Lockerungen mit der Cubic Bezier timing functions definieren.

Zum Beispiel anstelle der Standard linear Lockerung, könnten Sie so etwas wie:

.selector { 
    transition: right .5s cubic-bezier(.55,.04,.27,.91); 
} 

Für ein einfach zu bedienendes Werkzeug, Ihr eigenes Easing machen können Sie cubic-bezier.com versuchen.