Mobile JQ plug in hammer USES details

  • 2020-07-21 06:44:41
  • OfStack

From pc end to the mobile end believe many front-end siege t worry for the mobile end, write the original the phone end of the event is very arduous, and jq click 300 millisecond delay, now has a relatively good jq plugin hammer, Hammer. js is an open source, lightweight javascript library, it can do not need to rely on other thing in recognition under the condition of touching, mouse events to support all kinds of mobile phones, such as scaling, qq left sliding delete, zoom, rotate, etc.

To introduce hammer, use 1 tab toggle.

Usage:

1. First, introduce es18EN 2.0 and above and ES19en. hammer. js.

var hammertime = $('.tabs a').hammer();

3, you can directly add the event hammertime. on('tap', function(ev) {} using the tap in hammer click event. function can write its own js.


hammer.dragstart = function(ev) { };//  Began to drag </span>

hammer.drag = function(ev) { }; //  Drag the </span>
hammer.dragend = function(ev) { }; //  Drag the end </span>
hammer.onswipe = function(ev) { }; //  sliding </span>
 
hammer.tap = function(ev) { }; //  Click on the </span>
hammer.doubletap = function(ev) { }; // Double click on the </span>
hammer.hold = function(ev) { };//  Long press </span>
 
hammer.release = function(ev) { }; //  Finger off screen </span>

Experience links: http: / / hammerjs github. io /

js code


$(function() {
  var hammertime = $('.tabs a').hammer();
  hammertime.on('tap', function(ev) {
    $(this).addClass('actives').siblings().removeClass('actives');// add 1 a class  Peer removal. 
    var index = $('.tabs a').index(this); // The index 
    $('.tab-bott').eq(index).show().siblings().hide(); 
  })
})

This is the end of this article, I hope you enjoy it.


Related articles: