Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disable HammerJS swipe and drag events on computer? (i.e. disable on mouse events?)

I'm using Hammer.js found here:
http://eightmedia.github.io/hammer.js/

and I set-up/create the Hammer object like this:

var hammertime = Hammer(document.body)
                      .on("pinchin drag swipe", function(event) {
                        var alpha_value = $( "#collide_alpha" ).slider( "option", "value" );
                        var beta_value = $( "#collide_beta" ).slider( "option", "value" );
                        if(alpha_value < 50) {
                          $( "#collide_alpha" ).slider( "value", ~~(+alpha_value+(event.gesture.distance/30)) );
                        } else if(alpha_value <= 100) {
                          $( "#collide_alpha" ).slider( "value", ~~(+alpha_value-(event.gesture.distance/30)) );
                        }
                        if(beta_value < 50) {
                          $( "#collide_beta" ).slider( "value", ~~(+beta_value+(event.gesture.distance/30)) );
                        } else if(beta_value <= 100) {
                          $( "#collide_beta" ).slider( "value", ~~(+beta_value-(event.gesture.distance/30)) );
                        }
                      });

After, I tried to do this:

// Try to disable the mouse movements on computer
hammertime.STOP_MOUSEEVENTS = true;
hammertime.NO_MOUSEEVENTS = true;

But that doesn't work, so how should I disable the events just for computers? but leave them active for iPhone and Android. I don't care about Windows 8 touch-screens at the moment so I don't mind that it would not work for those.

like image 961
dan2k3k4 Avatar asked Oct 30 '25 22:10

dan2k3k4


2 Answers

I normally try and detect if the device is a touch screen before firing hammer. Its better to only load when you need it rather than when you dont

One of the most supported ways off doing this is

var is_touch_device = 'ontouchstart' in document.documentElement;

Then just wrap your hammer initialisation in

if(is_touch_device){
  // hammer stuff
}

Alternatively you could sniff the user agent if you only care for a few devices but this could be a bit clunky and prone to missing things.

like image 161
Dominic Green Avatar answered Nov 01 '25 11:11

Dominic Green


I use Modernizr to decide if I should run hammer:

     if ( Modernizr.touch )
     {
        $("#cr-stage").hammer().on( "swipeleft swiperight swipeup swipedown doubletap pinchin", gesture );
        $("#cr-stage").hammer().on( "release", releaseGesture );
     }

This is more reliable than user agent sniffing.

like image 24
Rafael Baptista Avatar answered Nov 01 '25 11:11

Rafael Baptista