'How to move an element in an eclipse shape using html css or in reactjs

I want to move the child-element in an eclipse shape that is parent-track. How to do it? I used positions but it doesn't move smoothly when it comes in curve path. Thank you in advance.

.parent-track {
    width: 200px;
    height: 120px;
    background-color: rgb(130, 238, 148);
    margin: auto;
    border-radius: 250px 250px 250px 250px;
    position: relative;
    border: 1px solid black;
}

.child-element {
    width: 10px;
    height: 10px;
    background-color: black;
    position: absolute;
    animation: move;
}
<div class="parent-track">
        <div class="child-element"></div>
      </div>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source