Accessibility Modes

You might want to display or hide some content depending on the accessibility mode. For example, you might want to display a video with subtitles in the accessibility mode, but not in the standard mode.

The mechanism is based on specifying a css class to the item requiring dynamic display capabilities.

For instance a paragraph to be displayed only when easyread is on should be written as:

<p class="show-when-easyread">This paragraph is visible in Easy Read mode only</p>

This approach works for any HTML tags allowed in the application (native html tags allowed by default, and additional convenience web-components).

The syntax of the class name is: class="{state}-when-{accessibityOption}"

Where, allowed accessibilityOptions are signlanguage, readaloud or easyread; allowed state values are show or hide.

Examples:

• the class name hide-when-easyread will hide the item when easyread is on for a specific users

• the class name show-when-readaoud will show the item when the user has its readaloud switched on.