search

Accessible360 / accessible-slick

the last (accessible) carousel you'll ever need.
https://accessible360.github.io/accessible-slick
MIT License
259 stars 47 forks source link

Slider Syncing #40

Closed drewhilltmp closed 3 years ago

drewhilltmp commented 3 years ago

The original version of Slider Syncing using the navFor option allows you to click on the nav items and that interaction subsequently changes the slide being displayed. I noticed that this "on click" feature no longer exists on the accessibility version, was this by design or is that perhaps a bug?

jasonwebb commented 3 years ago

Hi @drewhilltmp! Are you referring to the focusOnSelect option? If so, yes, that has been deprecated because moving a user's focus when they've activated (clicked) a slide is very disruptive for screen reader and keyboard-only users, and potentially a violation of WCAG 3.2.2.

If you're referring to some other functionality, can you please provide a code sample that demonstrates this issue?

If you'd like to make individual slides be actionable controls for another carousel, you'll need to wrap each slide in a <button> tag and dynamically apply the aria-current="true" attribute to whichever button is currently selected, as shown in this code sample: https://codepen.io/A360/pen/BaKwaGa

drewhilltmp commented 3 years ago

@jasonwebb , nobody wants to be violating WCAG, so thank you for the clarification on that. We will deploy your outlined alternative solution. Thanks so much for the speedy response!