16 11, 2017

How To Remove Aria-Described By if Dots are Disabled in Slick Slider

By | 2019-09-25T13:01:57+00:00 November 16th, 2017|Categories: Web Development|Tags: , , |

Need to remove the aria-described by tag if no control dots are needed? Try this:

This allows Slick Slider to pass accessibility testing.

Change “.slide-title” to your respective class name.

$(‘.slide-title’).each(function () {    var $slide = $(this).parent();

if ($slide.attr(‘aria-describedby’) != undefined) { // ignore extra/cloned slides        $(this).attr(‘id’, $slide.attr(‘aria-describedby’));    }});

Or if you want to just target the each slide itself, you can use this code for an example.

$(‘.slide’).each(function () {    var $slide = $(this);

if ($slide.attr(‘aria-describedby’) != undefined) { // ignore extra/cloned slides        $(this).attr(‘id’, $slide.attr(‘aria-describedby’));    }});

Sources: https://github.com/kenwheeler/slick/issues/2020