CODEWITHSUNDEEP
htmlknockout.jswai-ariascreen-readersnvda
major
major

Reputation: 1

NVDA screen reader only reads the value from span

I am trying to add a text verbiage to my screen reader "The progress is at x%". However, NVDA screen reader only says the digits out loud.

I am trying to show only the x% to the user, but for screen readers i want to add extra context with the more verbiage.

This is my current code:

<div class="progress">
  <div class="progress-bar" 
    role="progressbar" aria-valuemin="0" aria-valuemax="100"
    aria-labelledby="progress-label"
    data-bind="style: {'width': percent()+'%'},
    attr: {'aria-valuenow': percent()}">
  </div>
  <span id="progress-label" aria-live="polite"
    data-bind="text: percent()+'%'">
  </span>
</div>

and I have tried adding the following:

`'aria-valuetext': 'The progress is at ' + percent() + '%'}"> 
to the attr: {'aria-valuenow': percent()}`.

However, NVDA continues to only read out loud the data-bind="text: percent()+'%'" from the span.

Upvotes: 0

Views: 35

Answers (0)

Related Questions