Problem with CSS animation

Question

I’m working on this little project and it seems to work alright for a few seconds. Both the “lungs” expand and contract slowly, but after that one cycle it skips the contraction and chops to the expansion. How can I fix this to help to run more smoothly?

https://code.sololearn.com/WuwIzhb0caWk/?ref=app

Answer 1

https://code.sololearn.com/W8fu3C8gHErn/?ref=app

Answer 2

try to use this
animation-timing-function: linear;
it make the animation smooth and make the end same as the start

Answer 3

I tried that but it still isn't working

Answer 4

its beacuse the end of the animation and the beginning of the animation is not same

Answer 5

check this i demonstratie both situation..

Answer 6

Okay, but I think it must be different with an ellipse.

Answer 7

I got it, finally😂 thank you so much for your time. it helped

Answer 8

im glad