Animating the progress bar on hover.

Question

Description: I want to animate progress bar on hover. I want to animate it once.

Problem: On hover the animation takes place two times, first it runs on default speed and then it animates on given time. Please wait, it will play twice.

Solution: Please help me to animate only once on given time.

DODE LINK: https://code.sololearn.com/WES25PGWIluk/#css

Answer 1

Adarsh Mamgain Hey bro, just remove the animation delay from the animation :)) Add this :

animation: transWidth ease-out 0.8s 1 normal forwards;

Answer 2

Thank you both it works. Mandeep Kaur Man Of Action