CODEWITHSUNDEEP
javascriptjqueryiosdom-eventshammer.js
Cofey
Cofey

Reputation: 11404

How to fire method only once when using panright with Hammer.js?

I am running into issues with getting Hammer.js (with the jQuery plugin) to function properly when using swiperight. Therefore, I need to use panright.

When panning to the right, my event fires many, many times.

How can this be updated so it only runs once? (then again when the user swipes to the right or left on another slide)

$('.slide').hammer().on('panright', doSomething);

Upvotes: 5

Views: 2887

Answers (3)

Giuseppe Caponetto
Giuseppe Caponetto

Reputation: 139

You can filter the event by isFinal property:

var mc = new Hammer($('.screen'));
mc.on("swipeleft", moveHandler);
mc.on("swiperight", moveHandler);

function moveHandler(event){
  if(event.isFinal){
  // do something on the last animation frame
  }
}

Upvotes: 2

Elte156
Elte156

Reputation: 324

There are other events called 'swipeleft' and 'swiperight'. This will respond to 1 swipe event instead of pan's multiple fired events.

var mc = new Hammer($('.screen'));
mc.on("swipeleft", moveHandler);
mc.on("swiperight", moveHandler);

function moveHandler(event){
    // do something
}

Documentation

Upvotes: 1

user1630809
user1630809

Reputation: 532

I think you should capture a panend event. For example:

var myElement = document.getElementById('myID');
var mc = new Hammer.Manager(myElement);
mc.add(new Hammer.Pan({direction:Hammer.DIRECTION_HORIZONTAL, threshold:80, pointers: 0}));
mc.on("panend", function(ev) {
  if(ev.direction == Hammer.DIRECTION_RIGHT) 
  {
    //do what you want here
  }
});

Upvotes: 9

Related Questions