9 Replies
Jessica Moscrop

Hi there,

I know this topic is a little old, but I would like to resurrect it with a couple of new questions.

I am making a  keyboard navigation accessible course and am experiencing issues with the use of layers. I can get the layers to open and I can navigate within the layers by using triggers to open layers but I am having problems with:

  1. Closing layers: Every time I close a layer the keyboard navigation marker returns to the first object on the base layer screen instead of where it was before the layer opened. I would like the keyboard navigation to return to where it was. I have tried selecting "Pause timeline of base layer" from layer properties on the new layer, but this doesn't help.
  2. Using grouped items as a trigger: I have grouped an image and text together and used the group as a trigger for a new layer to open. This works when I click on the layer, but doesn't work when I try to use the keyboard navigation I have set up (eg. show layer when user presses "Enter"). Is this happening because I have used the group as a trigger?

Thanks.

Leslie McKerchie

Hello Jessica and welcome to E-Learning Heroes :)

Thanks for reaching out and letting us know what you're working on. Hopefully, the community will be able to chime in and share some best practices and ideas for your design.

You can customize the tab order of your slide objects as explained in this documentation. If you could share your .story file with our team here, we'd be happy to take a look at the behavior you are experiencing.

Check out this conversation where Wendy shared an idea for grouped items with a trigger.

Jessica Moscrop

Hi Leslie,

Thank you for the link to Wendy's conversation about layers. I wonder if the issues I am experiencing relate to combining states and layers.

Please can you check out my slide (attached) and let me know if you think that is why the keyboard navigation is not returning to the same spot on the base layer.

Leslie McKerchie

Thanks so much for sharing your file so that I could take a look, Jessica.

The fix is much easier than we both imagined :)

I noticed that the layers had different triggers and the Disability layer was working as intended for me, so that's where I started. Here's my Peek of my findings.

So, I deleted all the triggers to close the layer when the user hit Enter and voila, it works :)

Take a look at your updated file attached.

Jessica Moscrop

Thanks Leslie - I love the Peek to show what you did here.

So that is Question 2 completely resolved. Brilliant.

Is there any chance you could help out with my original Question 1 too? Is what I am doing here more suited to using layer states instead? I can't think of any other ways to get the keyboard navigation to return to the object it was on before going to each new layer.

Crystal Horn

Hi again, Jessica.  This is a great conversation to have.  Tab order, especially with layers, takes me a minute every time to master.

Here's what it comes down to:

  • There is one tab order for the entire slide, layers and all.  Tabbing will follow this order whether on the base or a layer.
  • Once you tab to an item, tab order will continue to cycle through the remaining items in tab order, as long as they're visible and clickable.

Let's look at a snippet of your tab order:

The layer items are showing at the top, and the base layer objects are beneath (Header and NDIS objects).  If I open the Location layer, and then tab to the Close button, I'm on the 2nd line of that screenshot.  The next item I would be tabbing to would be the Header - Help.  Citizenship and Age won't count because they aren't visible on the screen.  

Once back on the base layer, let's say I tab to open the Citizenship layer, and then tab to close it.  That puts me back to 4th line of the screenshot, which means I have to cycle through the rest of the visible objects again.  Tabbing just keeps going down the list to the next visible item.

You questioned whether it might be better to use states instead of layers.  That's a possible workaround!  If you keep everything on the base layer, you'll have better control over the tabbing order.