Enable Touch Swipe Function in WordPress

There are plenty of plugins that can help you to create a slider with touch function from WordPress. However, you may not have full control of the configuration and sometimes it may slow down your performance. 

I tried Jquery Mobile plugin, and it shows an error "define is not defined". So I have to use an alternative of Jquery Mobile, which is Jquery Mobile Bower

bower install jquery-mobile-bower --save

It works well, but it causes confliction between WordPress Jquery version which leads to theme's misbehaviors. 

Then I tried TouchSwipe Jquery Plugin. This time, it works great with my current WordPress version. I integrated it with Bootstrap Carousel v4 for swiping images on mobiles and tablets. 

bower install jquery-touchswipe --save

The usage is quite simple

$(function() {
  $("#test").swipe( {
    //Generic swipe handler for all directions
    swipe:function(event, direction, distance, duration, fingerCount, fingerData) {
      $(this).text("You swiped " + direction );  
    }
  });
});