PixiJS

Namespace: accessibility

accessibility

The accessibility module recreates the ability to tab and have content read by screen readers. This is very important as it can possibly help people with disabilities access PixiJS content.

This module is a mixin for AbstractRenderer and will need to be imported if you are managing your own renderer. Usage:

import 'pixi.js/accessibility';

To make an object accessible do the following:

container.accessible = true; // object is now accessible to screen readers!

See AccessibleOptions for more accessibility related properties that can be set.

Classes

AccessibilitySystem

Interface Definitions

AccessibleOptions

When accessible is enabled on any display object, these properties will affect its accessibility.

Properties:
Name Type Default Description
accessible boolean false

Flag for if the object is accessible. If true AccessibilityManager will overlay a shadow div with attributes set
accessibleChildren boolean true

Setting to false will prevent any children inside this container to be accessible. Defaults to true.
accessibleHint string | null

Sets the aria-label attribute of the shadow div
accessiblePointerEvents PointerEvents 'auto'

Specify the pointer-events the accessible div will use Defaults to auto.
accessibleTitle string

Sets the title attribute of the shadow div If accessibleTitle AND accessibleHint has not been this will default to 'container [tabIndex]'
accessibleType string 'button'

Specify the type of div the accessible layer is. Screen readers treat the element differently depending on this type. Defaults to button.
tabIndex number 0

Type Definitions

PointerEvents

ts:3

The type of the pointer event to listen for. Can be any of the following:

  • auto
  • none
  • visiblePainted
  • visibleFill
  • visibleStroke
  • visible
  • painted
  • fill
  • stroke
  • all
  • inherit
See: