iOS 14 safari animation-timing-function bug

Viewed 415

I got a bug on using animation-timing-function in safari after updated to iOS 14.

Before iOS 14, animation-timing-function is used to control the speed of the properties (likes top, left, opacity). But now it seems to control the timing. Below is the example :

.div{ 
    animation: my-ani 10s ease-out; 
}

@keyframes my-ani {
    0%, 30% { 
       left:0px 
    }
    100% { 
       left:100px 
    }
}

In the past (browsers except for safari in iOS 14), the animation starts at 3s and moving to 100px with the speed of ease-out in 7 seconds. But in safari 14, it will start before 3s (I don't know the exact time) with a linear speed in more than 7 seconds. Does anyone know what is the reason for this issue? Thanks.

0 Answers
Related