0

我正在使用 Owl Carousel 2 并且我有(并且想要)mouseDrag 和 touchDrag 处于活动状态。

但是,当我单击幻灯片中的任何内容时,owl 认为我拖动并更改了幻灯片,因此它会触发 onDragged 回调。我没有改变幻灯片,我只是点击了一张幻灯片(“mousedown”,“mouseup”触发onDragStart)。

我希望能够做某事,并且只有当我通过拖动移动更改特定幻灯片时(例如:我从幻灯片 1 转到幻灯片 2)。更具体地说,我想阻止 onDragStart 除非我真的从一张幻灯片更改为另一张幻灯片。

我究竟做错了什么?

4

1 回答 1

2

你可以尝试类似的东西。将幻灯片更改前的当前幻灯片的索引存储在全局变量 (onDrag) 中。幻灯片更改后(onTranslated)再次检查索引,看看索引是否仍然相同。如果不是 --> 幻灯片已更改。

所有事件都列在这里: 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');
    }
}
于 2016-02-01T16:23:28.923 回答