pixi.js
    Preparing search index...

    Interface AccessibleOptions

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

    const container = new Container();
    container.accessible = true;
    container.accessibleTitle = 'My Container';
    container.accessibleHint = 'This is a container';
    container.tabIndex = 0;
    interface AccessibleOptions {
        accessible: boolean;
        accessibleChildren: boolean;
        accessibleHint: string;
        accessiblePointerEvents: PointerEvents;
        accessibleText: string;
        accessibleTitle: string;
        accessibleType: keyof HTMLElementTagNameMap;
        tabIndex: number;
    }
    Index

    Properties

    accessible accessibleChildren accessibleHint accessiblePointerEvents accessibleText accessibleTitle accessibleType tabIndex

    Properties

    accessible: boolean

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

    false

    const container = new Container();
    container.accessible = true;
    accessibleChildren: boolean

    Setting to false will prevent any children inside this container to be accessible. Defaults to true.

    true

    const container = new Container();
    container.accessible = true;
    container.accessibleChildren = false; // This will prevent any children from being accessible

    const sprite = new Sprite(texture);
    sprite.accessible = true; // This will not work since accessibleChildren is false
    accessibleHint: string

    Sets the aria-label attribute of the shadow div

    null
    @advanced

    const container = new Container();
    container.accessible = true;
    container.accessibleHint = 'This is a container';
    accessiblePointerEvents: PointerEvents

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

    'auto'

    const container = new Container();
    container.accessible = true;
    container.accessiblePointerEvents = 'none'; // or 'auto', 'visiblePainted', etc.
    accessibleText: string

    Sets the text content of the shadow

    null

    const container = new Container();
    container.accessible = true;
    container.accessibleText = 'This is a container';
    accessibleTitle: string

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

    null

    const container = new Container();
    container.accessible = true;
    container.accessibleTitle = 'My Container';
    accessibleType: keyof HTMLElementTagNameMap

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

    'button'

    const container = new Container();
    container.accessible = true;
    container.accessibleType = 'button'; // or 'link', 'checkbox', etc.
    tabIndex: number

    Sets the tabIndex of the shadow div. You can use this to set the order of the elements when using the tab key to navigate.

    0

    const container = new Container();
    container.accessible = true;
    container.tabIndex = 0;

    const sprite = new Sprite(texture);
    sprite.accessible = true;
    sprite.tabIndex = 1;

    Settings

    Member Visibility

    On This Page

    Properties