Is it possible to hide arrows if there are not enough slides to trigger scrolling?

[untitledgraphic]

In a scenario where I have six slides, but slidesToScroll is set to eight, both prev and next arrows are visible but disabled.

When there are more than slidesToScroll value (in this case eight) a disabled arrow makes sense as this indicates you have come to the end of the slides, but when both end up being disabled they are just unnecessary.

So, is it possible to hide the arrows if there are fewer slides than the value that slidesToScroll is set?

[Shekar742368]

+1

[14nd90]

+1 for the feature

My workaround below - I had a multiple glider setup

const gliders = document.querySelectorAll('.glider');

function evaluateGliders() {

  gliders.forEach(glider => {

    const wrapper = glider.parentNode;

    const fnc = wrapper.querySelector(".glider-prev.disabled") &&
                wrapper.querySelector(".glider-next.disabled") ?
                  'remove' : 'add';

    wrapper.classList[fnc]('has-scroll'); 

    //use the below if container size is changed, for example
    Glider(glider).refresh();

  });

}

gliders.forEach(glider => {

  const wrapper = glider.parentNode;

  new Glider(glider, {
    slidesToShow: 'auto',
    itemWidth: 200,
    draggable: true,
    arrows: {
      prev: wrapper.querySelector('.glider-prev'),
      next: wrapper.querySelector('.glider-next'),
    }
  });

});

evaluateGliders();
window.addEventListener("resize", evaluateGliders);

Then use CSS to show/hide the buttons based on the presence of .has-scroll