Owlcarousel2: Links inside owl carousel need double click to work

Created on 4 Jun 2017 · 9Comments · Source: OwlCarousel2/OwlCarousel2

I have an issue with Owl Carousel v2.2.1. I have set up my carousel and everything works properly. But when I click inside an item which has an anchor tag as child element, sometimes, two clicks are needed in order to redirect to the anchor href link. My code:
.html

<div class="owl-carousel owl-theme">
    <div class="item"><a href="#test"><img src="img.jpg"></a></div>
    <div class="item"><a href="#test"><img src="img.jpg"></a></div>
</div>

.js

    $('.owl-carousel').owlCarousel({
        loop:false,
        margin:10,
        nav:false,
        responsive:{
            0:{
                items:1
            },
            600:{
                items:3
            },
            1000:{
                items:5
            }
        }
    })

I have noticed that this happens after I pull carousel to the edge and then try to click the element from which the drag started.
I have not found any related issues.

Source

wishmasterher

Most helpful comment

Experiencing exactly the same problem

thomaskrammer on 29 Sep 2017

👍3

All 9 comments

Hi @wishmasterher , I have a problem that I do not know if it's the same, but when I double-click on the item, the carousel gets lost, is that what happens to you, too?

estevammrodrigues on 20 Jun 2017

I am having this exact problem. The first click isn't being registered but if you click again it works.. I have an anchor tag wrapped around an img just like you. It's only happening sometimes when I drag as well.

jpsierens on 23 Jun 2017

A fix has been commented here: https://github.com/OwlCarousel2/OwlCarousel2/issues/1864

jpsierens on 23 Jun 2017

Hi @jpsierens ,

My problem was not resolved with this fix :(

estevammrodrigues on 26 Jun 2017

Hi @estevammrodrigues I have both issues. If I double tab at the end of carousel it fly out to the left, and no owl-item have 'active' class. It happens randomly, not always, so I can't understand what's the reason. Did you found a solution?

rtvt on 14 Jul 2017

Hi, @roytvelvet , I have not found a solution yet :/ and you?

estevammrodrigues on 25 Aug 2017

Experiencing exactly the same problem

thomaskrammer on 29 Sep 2017

👍3

I have an even worst problem: to me links inside the item doesn't work at all. But worst than worst, nore mouseDrag nore touchDrag works, even if I also forced them in the options. Here it is my initialization:

$('.owl-carousel').owlCarousel({
autoWidth : true,
loop : false,
center : true,
nav : false,
items : 1,
startPosition : 1,
dots : true,
mouseDrag : true,
touchDrag : true
});

angelarted on 10 Nov 2017

Ah dang... was hoping there was a ready solution to this. I have the same problem as others and angelarted, except mine aren't working on a double-click either.

My links never work, despite not having used any touchDrag, so not a dup of #1864.

Have been donking around for a while on this, so any help would be much appreciated. Thanks!