alexfoxy / lax.js

Simple & lightweight (<4kb gzipped) vanilla JavaScript library to create smooth & beautiful animations when you scroll.
MIT License
10.43k stars 491 forks source link

Animate border-radius in % rather than pixels #165

Open lukeHT opened 3 years ago

lukeHT commented 3 years ago

lax.js version 2.0.3

Describe the bug I'd like to use % for 'border-radius' value, but each time I try to do something with that it crashes. I tried to use both cssUnit and cssFn, but with no luck. There's no error, no anything, just the code is not applied.

Code

"border-radius": [
    [0, "screenHeight"],
    [50, 0],
    {
        easing: 'easeInOutQuint',
        cssUnit: '%',
    }
]
"border-radius": [
    [0, "screenHeight"],
    [50, 0],
    {
        easing: 'easeInOutQuint',
        cssFn: (val) => {
            return `${val}%`;
        }
    }
]