mousedragging opens lightbox

[dijkermans]

Hi,

When using a lightbox, it opens when you mousedrag a slide. It should only open when you click. It works fine with Owl.

I'm using Tiny Slider with Lightgallery but it also happens with Ekko Lightbox, so it seems to be an issue with Tiny Slider.

Example:

https://codepen.io/TOUnail/pen/EeyGOO

This problem doesn't occur with Owl.

Any idea how to solve this?

tns 2.9.3

[dijkermans]

Seems to be an old unfixed issue: https://github.com/ganlanyuan/tiny-slider/issues/360 https://github.com/ganlanyuan/tiny-slider/issues/189

[dijkermans]

Normally this would have been a good workaround, but unfortunately, dragStart and dragMove are triggered on mousedown without moving.

slider.events.on('dragStart', function () {

document.body.classList.add('drag');

});

slider.events.on('dragEnd', function () {

document.body.classList.remove('drag');

});

.drag .slider .tns-item a { pointer-events:none }

[rozaljkeee]

You can use custom events of tiny slider to track mouse drag. Something like this:

var dragMove = false;
slider.events.on('dragEnd', function (info) {
    dragMove = false;
});
slider.events.on('dragMove', function (info) {
    dragMove = true;
});

And check this variable before lightbox usage In this way you can understand is it normal click or slider drag

UPD: ⚠️ Be careful of use dragEnd, because this event is not fired when curson returns to exactly same place after dragMove