Glide arrow button firing twice on iPhone 11

[mancas11]

When tabbing next/prev button on iPhone 11 glidejs fires two events and slides two times. When tabbing and holding while first transition finishes it onlys fires ones.

I have tested the same slider on iPhone 8 and 6S and there is no issue on these devices.

[DFelten]

We have the same bug on iOS 13. Has anyone found an alternative solution or a workaround?

[DFelten]

A temporary solution is to using a custom method for moving the slider. So just remove data-glide-el="controls" and use instead an own click method with glide.go('>') and glide.go('<').

With glide.go the bug is gone for me.

[ltctech]

<a> tags fire twice. <button> tags fire once. Simple fix.

[PaulPrecept]

<a> tags fire twice. <button> tags fire once. Simple fix.

Not as simple a fix as @ltctech states. I'm not using either <a> or <button> tags and it's doing it on iphone 11. I have a <ul> with data-glide-el="controls" and <li>'s with data-glide-dir values.

Triggers twice on iPhone 11, once everywhere else I've tested.

I followed @DFelten's advice and removed data-glide-el="controls" from my <ul> and added my own click listener which called glide.go( $(this).data('glide-dir') ).

[FernE97]

Removing the data-glide-el="controls" and adding this worked for me.

const glideArrows = document.querySelectorAll('.slider__arrow')

glideArrows.forEach(function(glideArrow) {
  glideArrow.addEventListener('click', function() {
    glide.go(glideArrow.dataset.glideDir)
  })
})

[iKlancar]

For .ts Like stated above, remove data-glide-el="controls" and add the following before glide.mount();

const glideArrowLeft = document.querySelector('.glide__arrow--left')
const glideArrowRight = document.querySelector('.glide__arrow--right')

glideArrowLeft.addEventListener('click', function() {
   glide.go('<');
})
         
glideArrowRight.addEventListener('click', function() {
   glide.go('>');
})

[PaulPrecept]

Many thanks for your email.

I'm now out of the office until 13th September.

Best wishes Nick

[xfra35]

I faced the same bug, which seems to be related to iOS triggering both click and touchstart event.

Commenting out the line which binds the touchstart event fixed the problem for me:

bind (elements) {
  for (let i = 0; i < elements.length; i++) {
    Binder.on('click', elements[i], this.click)
    // Binder.on('touchstart', elements[i], this.click, capture)
  }
},