João
João

Reputation: 633

How to use touch events without importing a whole mobile-driven JavaScript framework?

I'm working on a responsive design on which I'd like to use two specific touch events, tap and swipe. Is it possible to import a single jQuery Mobile slice (i.e. jquery.mobile.events.js) or a piece of any other mobile-driven JavaScript framework, without importing the entire set of assets? I'm currently using jQuery, just so you know.

Upvotes: 7

Views: 6636

Answers (3)

ThiagoPXP
ThiagoPXP

Reputation: 5462

You can also just download the module Events.Touch from jQuery Mobile using their download builder http://jquerymobile.com/download-builder/

Just tick the option 'Touch', add the JavaScript file to your project so you can start listening to events such as:

  • touchstart
  • touchmove
  • touchend
  • tap
  • taphold
  • swipe
  • swipeleft
  • swiperight
  • scrollstart
  • scrollstop

ps: You must be using the jQuery library as jQuery mobile runs on top of it.

Upvotes: 12

João
João

Reputation: 633

I just found a solution for my problem: TouchSwipe, a jQuery plugin for touch devices that handles swipe events. Like a boss!

Upvotes: 0

Googlian
Googlian

Reputation: 6723

You can use TouchSwipe Jquery plugin, it is the easiest plugin ever when Jquery performed.

https://github.com/mattbryson/TouchSwipe-Jquery-Plugin

$(function() {
  $(".carousel-inner").swipe({
    allowPageScroll:"auto",
    swipe:function(event, direction, distance, duration, fingerCount, fingerData) {
      if(direction == 'left'){
        $(this).parent().carousel('prev');
      }
      else if(direction == 'right') {
        $(this).parent().carousel('next');
      }
    }
  });
});

Upvotes: 0

Related Questions