Making Drag Text Accessible

Submitted by maggierogers402 on Mon, 04/19/2021 - 17:11
Forums: 
Content creation

I tried to use the tab key and arrow keys to see if keyboard navigation works for the visually impaired in a drag text interaction I made.  So far no dice, but perhaps there is some step I need to take to "turn on" keyboard navigation.

 

Thank you, in advance, for any suggestions.

Maggie Rogers

Ohio State University

 

Content types: 
Drag the Words
BV52's picture

BV52

Tue, 04/20/2021 - 19:26

Hi Maggie,

The Drag Text should work with keyboard only navigation. The keys to use are as follows:

  1. Tab - Highlight the draggable words
  2. Arrow keys to move between the draggable words
  3. Space to "pick up" the word (automatically highlights the drop zones)
  4. Arrow keys to move between the drop zones
  5. Space to drop the word.

-BV

mmercer

Thu, 07/15/2021 - 00:28

I followed the steps above using JAWS 2020 and Chrome Version 91.0.4472.124 (Official Build) (64-bit)  .
Steps 1-4 work fine. Step 5 doesn't. I can't get the selected "picked up" word to drop. This is very frustrating.

mmercer

Thu, 07/15/2021 - 00:30

I followed the steps above using JAWS 2020 and Chrome Version 91.0.4472.124 (Official Build) (64-bit)  .
Steps 1-4 work fine. Step 5 doesn't. I can't get the selected "picked up" word to drop. This is very frustrating.

mmercer

Thu, 07/15/2021 - 00:30

I followed the steps above using JAWS 2020 and Chrome Version 91.0.4472.124 (Official Build) (64-bit)  .
Steps 1-4 work fine. Step 5 doesn't. I can't get the selected "picked up" word to drop. This is very frustrating.

BV52's picture

BV52

Thu, 07/15/2021 - 19:00

Hi mmercer,

I just tried this and everything is working as expected. A few things that you can try to isolate the issue:

  1. Use a different browser/computer.
  2. Disable other plugins in Chrome.

-BV