Topic: How To Reverse Animated Progress Bar Striped

Diego pro asked 4 years ago


Question,

There is an easy way to rever the direction of a progress-bar-animated progress-bar-striped?

It will be nice to have a class that does that.

Something like progress-bar-animated-reverse or progress-bar-striped-reverse

Thank you


Marta Wierzbicka staff answered 4 years ago


Hi,

thank you @poomkawin for your solution. @Diego, do you need more help from us?

Best, Marta


Marta Wierzbicka staff answered 4 years ago


Hi,

thank you @poomkawin for your solution. @Diego, do you need more help from us?

Best, Marta


Marta Wierzbicka staff answered 4 years ago


Hi,

thank you @poomkawin for your solution. @Diego, do you need more help from us?

Best, Marta


poomkawin free answered 4 years ago


Hi,

You can do that by simply put

animation-direction: reverse;

to the style attribute of the progress bar you want to reverse

e.g.

<div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="animation-direction: reverse; width: 50%;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.10
  • Device: All
  • Browser: All
  • OS: All
  • Provided sample code: No
  • Provided link: No