jQuery UI Progressbar изменение направления

Question

Направление по умолчанию панели прогресса jQuery UI - слева направо. Как я могу изменить это так, чтобы это переместилось справа налево после завершения? Ниже приведен пример того, чего я пытаюсь достичь.

Answer 1

Только CSS, попробуйте добавить это на свою страницу:

.ui-progressbar .ui-progressbar-value {
  float: right;
}

Это не полный ответ, но тест, чтобы увидеть, если это то, что вы хотели.

Answer 2

Вы также можете использовать CSS3, чтобы повернуть индикатор на 180 градусов:

#progressbar {
    transform:rotate(180deg);
    -ms-transform:rotate(180deg); /* IE 9 */
    -moz-transform:rotate(180deg); /* Firefox */
    -webkit-transform:rotate(180deg); /* Safari and Chrome */
    -o-transform:rotate(180deg); /* Opera */
} 

скрипка

Не проверено на старых версиях IE.

Answer 3

$( "#progressbar-2" ).progressbar({
           isRTL: true,
           value: 30,
           max:300
        });

Answer 4

Я должен был решить ту же проблему сегодня с помощью индикатора выполнения углового интерфейса. Другие ответы были близки, но не сработали в начальной загрузке 3 без изменения всех экземпляров, что было неприемлемо для меня.

Это сработало... Селектор получает первый дочерний элемент div и затем применяет float

.progress-reverse div:nth-of-type(1) {
    float: right;
}

а также

<progressbar class="progress-striped progress-reverse active" value="progress" type="{{progressType}}"></progressbar>

Надеюсь это поможет!