swipe hammer example

by masteram

HTML

<script src="http://eightmedia.github.io/hammer.js/dist/hammer.js"></script>
<div id="blue"></div>
<canvas id="can" />

CSS

#blue{
	position:absolute;
	top:100px;
    left:100px;
	width:100px;
    height:100px;
	background-color:blue;
	cursor:pointer;
	right:
}
#can{
    
    width=200px;
    height:250px;
}

JavaScript

var blue = document.getElementById("blue");

Hammer(blue).on("swipeleft", function() {
    $(blue).animate({left: "-=100"}, 500)  
});

Hammer(document.getElementById("blue")).on("swiperight", function() {
    $(blue).animate({left: "+=100"}, 500)  
});

$("#can").hammer().on("pinch", function (e) {
    e.preventDefault();
    console.log(e);
});