Блог

Я некоторое время пытался выяснить, как правильно отобразить индикатор выполнения, но, похоже, я не могу понять это.

У меня есть целочисленное значение (<% goal.ppercent %>), которое я хочу установить в качестве значения прогресса выполнения бара. Когда я пытаюсь изменить какое-либо значение «aria-value», это не меняет индикатор выполнения, но когда я меняю значение style =» width: «, оно изменяет панель. Может кто-нибудь объяснить мне, как правильно выполнить индикатор выполнения начальной загрузки?

 <div class="progress">
    <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow= 
    <% goal.ppercent %> aria-valuemin="0" aria-valuemax="100" style="width: 60%">
    <%= number_to_percentage(goal.ppercent, precision: 0) %> 
    </div>
</div>
  

Вам нужно изменить ширину внутреннего .progress-bar , чтобы изменить процент.

ARIA просто означает доступные расширенные интернет-приложения. Это просто набор атрибутов, которые делают веб-контент более доступным для людей с ограниченными возможностями. На самом деле, вам не обязательно иметь атрибуты ARIA, чтобы панель процессов работала.

Поскольку у вас есть процент, просто продолжайте и обновите .process-bar ширину.

 <div class="progress">
    <div class="progress-bar progress-bar-striped progress-bar-animated" 
      role="progressbar" 
      aria-valuenow=<% goal.ppercent %> aria-valuemin="0" aria-valuemax="100" 
      style="width: <% goal.ppercent %>%;">
        <%= number_to_percentage(goal.ppercent, precision: 0) %> 
    </div>
</div>