일반 자바 스크립트 Hammer.js

Question

일반 Javascript 메서드를 사용하는 JQuery 선택기없이 hammer JS 이벤트를 사용하는 방법? GitHub의 문서를 통해

Answer 1

그냥 얼핏 :

var hammer = new Hammer(document.getElementById("container")); 

jQuery를하지 않고 '망치'를 만듭니다. 콜백 함수를 설정 한 후에도 jQuery가 필요 없다. 그러나 조심하십시오! HammerJS 내부적으로 jQuery를해야 할 수도 있습니다, 그래서 당신은 컨테이너 요소에 <script src="path/to/jquery.js"></script>

Answer 2

바인드 망치를 생략 할 수있다 : 수행되는 모든 제스처에 지금

var hammer = new Hammer(document.getElementById("container")); 

컨테이너 요소에서 제스처에 대한 정보가 포함 된 콜백 객체가 수신됩니다.

몇 가지 예를 들어 기능 : 당신이 JQuery와 리소스를 가져올 필요가 없습니다

hammer.ondragstart = function(ev) { }; 
hammer.ondrag = function(ev) { }; 
hammer.ondragend = function(ev) { }; 
hammer.onswipe = function(ev) { }; 

hammer.js은 완전히 독립 실행 형 버전으로 사용할 수 있습니다. 참조 : http://eightmedia.github.com/hammer.js/

전체 문서 : https://github.com/eightmedia/hammer.js#documentation

Answer 3

짧은 대답입니다 : 그냥 평범한 오래된 DOM API를 사용합니다. 은이 아니거나 은이 포함되면 jQuery 이외의 것을 사용하지 않아도됩니다.

var someElements = document.querySelectorAll('.someClass');//not jQuery, perfectly valid 
var byId = document.getElementById('someId'); 
var sameScript = $('#anotherId');//nothing stops me from doing this... using jQ for some things 

당신은 DOM이 어설픈 조금 (그것은이다), 여러분이이 같은 것을 할 수있는 무슨 API 찾을 경우,

var pureDOMRef = $('someID')[0];//returns "normal" Element object, removes jQ wrapper 
var multiple = Array.prototype.slice.apply($('.classSelector'),[0]);//returns Array 

그냥 놀러을 원하는 경우 앞뒤로 전환 , 아무 것도 잘못하지 않았습니다

Answer 4

새 버전의 hammer.js는 JQuery에서 플러그인이 아니라는 것을 먼저 이해해야하는 JQuery 플러그인을 제공합니다.이 플러그인은 JQuery 용입니다. hammer.js 이후

$(element).hammer(options).bind("pan", myPanHandler); 

이 할 수있는 현대적인 OOP 패턴을 가지고 다른 목적을 위해 귀하의 사이트에 대한 JQuery와 사용하는 경우 그럼 당신은 기본적으로 이런 JQuery와 선택기에서 망치에서 플러그인을 '적용'할 수있는 편리 한 번에 여러 데이터를 처리하기 위해 인스턴스를 사용하므로 해머에 바인딩 된 모든 JQuery 요소가 인스턴스입니다. (IMHO)이 플러그인을 사용하거나 바닐라에 머물고 싶지 않다면 JQuery가 약간의 속도로 느려집니다.

http://hammerjs.github.io/jquery-plugin/