var slider_element = $('.image-slider');

//  when the slider has been set up, fire the event off
slider_element.on('unslider.ready', function() {
    // add a class that makes it visible (it's hidden by default to prevent jerky load-in)
    $(this).addClass('is-setup');
    $('.unslider-nav').attr('aria-hidden', true);
});

// initialize the slider
var slider = slider_element.unslider({
    delay: 7000,
    speed: 500,
    // make custom nav links
    arrows: {
        prev: '<button type="button" class="unslider-arrow prev"><span class="visually-hidden">Previous slide</span></button>',
        next: '<button type="button" class="unslider-arrow next"><span class="visually-hidden">Next slide</span></button>',
    }
});

// change aria attributes when the slides shift
slider_element.on('unslider.change', function(event, index, slide) {
  $('.unslider_ul').attr('aria-activedescendant', "listbox1-" + (index + 1));
});