Good evening, today 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 (and browsers except safari in iOS 14), the animation start at 3s and moving to 100px with speed of ease-out in 7 seconds. But in safari 14, it will start before 3s (I don't know the exact time) with linear speed in more than 7 seconds. Do anyone know what is the reason on this issue? Thanks.
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 (and browsers except safari in iOS 14), the animation start at 3s and moving to 100px with speed of ease-out in 7 seconds. But in safari 14, it will start before 3s (I don't know the exact time) with linear speed in more than 7 seconds. Do anyone know what is the reason on this issue? Thanks.