Adding Touch support for jQuery Superslides using TouchSwipe

I was a bit confused when first using Superslides to find out it doesn't come with touch support out of the box. Here's what I did to enable it, maybe it of use for somebody who's wondering, too.

All Superslides examples use Hammer.js as an additional library to support touch. Recent versions of Hammer don't seem to work with Superslides anymore, though. TouchSwipe, on the other hand, does. Nice side effect: TouchSwipe has a smaller footprint than Hammer (11 vs 18 kB minified).

So I simply made sure jquery.touchSwipe.min.js gets included and added the following script to trigger the slide animations on swiping (.views-superslides-wrapper is my main Superslides wrapper):

// adding touch support for the main slider (using SouchSwipe)
var $slides = $('.views-superslides-wrapper');
$slides.swipe( {
  swipeLeft:function() {
    $slides.data('superslides').animate('next');
  },
  swipeRight:function() {
    $(this).superslides('animate', 'prev');
  }
});
Tags: 

Need a great new website or a helping hand with Drupal? Head over to www.klickreflex.de or contact me directly to see if we can work something out.