Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-31615

Ensure simulated controls are keyboard accessible - Morpheus

    XMLWordPrintable

    Details

      Description

      The left hand side navigation of the environment provides a series of links that can be used to navigate through pages of content. A control is provided at the top of the navigation that when activated allows the user to either expand or collapse the side navigation entirely. However, this control currently does not receive keyboard focus and therefore cannot be activated by a keyboard only user.

      <li class="Mrphs-toolsNav__menuitem Mrphs-collapseTools js-toggle-nav"><i class="fa fa-lg fa-angle-double-left"></i></li>

      Developers must ensure that all simulated controls implemented provide support for keyboard accessibility. As this control is created by placing event handlers on an <li> element, the element itself must be assigned <tabindex="0"> in order to draw keyboard focus, as well as device-independent event handlers to allow keyboard only users to activate the control with the "Enter" key.

        Gliffy Diagrams

          Zeplin

            Attachments

            1. 2017-04-05_14-34-55.png
              108 kB
              Matt Clare
            2. Expandable_Control-139592.PNG
              46 kB
              Matt Clare

              Issue Links

                Activity

                  People

                  • Assignee:
                    Unassigned
                    Reporter:
                    mclare Matt Clare
                  • Votes:
                    0 Vote for this issue
                    Watchers:
                    2 Start watching this issue

                    Dates

                    • Created:
                      Updated:
                      Resolved:

                      Git Integration