How to detect Bootstrap carousel change change?

I am using Bootstraps carousel (Bootstrap v3.3.4) along with this plugin called bootstrap-touch-carousel ( https://github.com/ixisio/bootstrap-touch-carousel ) to make my content swipable.

The problem I'm running into is that when I use it to scroll through my content, it disables all clickable elements in the element (links, inputs, etc.). I've already tried manually connecting event handling using the code:

$( "#myCarousel" ).bind( "touchend", function() { /*code for specific element*/}); 

      

        
        
        
      

    

But this is part of the job, so I only want to try to make the captions for the titles, I have put my content outside of the custom elements, and Im tried to make the content visible with a specific active element. To do this, I need to detect when the user is pushed to the next or previous element. I've already tried the code:

$('#myCarousel').bind('slide.bs.carousel', function (e) {
    console.log('slide event!');
});


$('#myCarousel').bind('slid.bs.carousel', function (e) {
    console.log('slide event!');
});

$('#myCarousel').bind('slide', function (e) {
    console.log('slide event!');
});

$('#myCarousel').bind('slid', function (e) {
    console.log('slide event!');
});

      

        
        
        
      

    

I've also tried this using bind instead, but nothing seems to work. It can't seem to detect the slide event.

I suspect it slides differently with bootstrap-touch-carousel, but I don't know how to detect when the user is navigating to the next or previous slide. Is there a way to do this? Or maybe a way to make the carousel slide feature work?