Question

我正在使用Owl Carousel 2，我已经（并希望）mouseDrag和touchDrag处于活动状态。

然而，当我点击幻灯片中的任何内容时，owl认为我拖动并更改了幻灯片，因此它会触发拖拽回调。我没有改变幻灯片，我只是点击幻灯片（“mousedown”，“mouseup”在onDragStart上触发）。

我希望能够做一些IF，只有在我通过拖动移动更改特定幻灯片时（例如：我从幻灯片1转到幻灯片2）。更具体地说，我想阻止onDragStart，除非我真的从一张幻灯片更改为另一张幻灯片。

我做错了什么？

Answer 1

你可以尝试类似的东西。在全局变量（onDrag）中更改幻灯片之前存储当前幻灯片的索引。幻灯片更改后（onTranslated）再次检查索引并查看索引是否仍然相同。如果不是 - ＆gt;幻灯片已更改。

此处列出所有活动： http://www.owlcarousel.owlgraphic.com/docs/api-events.html

var indexBeforeChange = -1;
$(function () {
    if ($('#slider .item').length > 1) {
        $('#slider').owlCarousel({
            onDrag: slideBeforeChange,
            onTranslated: slideChanged
        });
    }
});
function slideBeforeChange(event) {
    indexBeforeChange = event.page.index;
    console.log('indexBeforeChange: ' + indexBeforeChange);
}
function slideChanged(event) {
    var indexAfterChange = event.page.index;
    if (indexAfterChange != indexBeforeChange) {
        console.log('Slide changed, indexAfterChange: ' + indexAfterChange);
    } else {
        console.log('Slide did not change');
    }
}

Owl Carousel 2 - 单击幻灯片时拖动

1 个答案: