How to achieve constant speed (pixel/second) for variable heights?

nkbt / react-collapse

Component-wrapper for collapse animation with react-motion for elements with variable (and dynamic) height

MIT License

1.12k stars 113 forks source link

How to achieve constant speed (pixel/second) for variable heights? #261

Closed msikora78 closed 3 years ago

msikora78 commented 4 years ago

How to achieve constant speed (pixel/second) for variable heights? For example, with transitionDuration: 500ms very tall content would open very quickly, but very short content would be opening very slowly. How to achieve constant speed in pixels per second?

nkbt commented 4 years ago

I am not sure how possible this is with pure css. You may want to use a bit of JS to do that. Collapse gives you necessary callback so you can apply custom duration based on height.