title: How to swipe an element using hammer.js in Backbone View
body: <p>I'm pretty new to both backbone and hammer, but it took me a long time and I still didn't achieve my goal, so if someone could help, I'd be really thankful!
  I want to have this functionality: <a href="http://jsfiddle.net/uZjCB/7/" rel="nofollow">http://jsfiddle.net/uZjCB/7/</a> </p>
  
  <p>but using it in a backbone view.
  This is my code so far:</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Using backbone&lt;/title&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"&gt;        
  &lt;/head&gt;
  &lt;style&gt;
  body {
  overflow:hidden;
  height: 100%;
  }
  .colorContainer {
  position: relative;
  padding:0 100px;
  width: 40%;
  border: 1px solid;
  margin-top: 25px;
  }
  .color{
  position: relative;
  left: 100px;
  width:50px;
  height:50px;
  cursor:pointer;
  }
  #red .color {
  background: red;
  }
  &lt;/style&gt;
  &lt;body&gt;          
  &lt;script type="text/template" id="template"&gt;
  &lt;div id="red" class="colorContainer"&gt;
  &lt;div class="color redColor"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/script&gt;
  
  &lt;div id="container"&gt;&lt;/div&gt;
  
  &lt;script src="js/jquery1.9.js"&gt;&lt;/script&gt;
  &lt;script src="js/underscore.js"&gt;&lt;/script&gt;
  &lt;script src="js/backbone.js"&gt;&lt;/script&gt;      
  &lt;script src="js/jquery.hammer.js"&gt;&lt;/script&gt; 
  &lt;script src="js/modernizr.js"&gt;&lt;/script&gt;
  &lt;script src="js/main.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>main.js</strong></p>
  
  <pre><code>View = Backbone.View.extend({ 
  initialize: function(){ 
      this.render();
  }, 
  
  render: function() {
      var template = _.template($("#template").html(), {} );
      this.$el.html( template );
      this.$el.hammer();
  },
  
  events: {
      "swipe" : "swipeIt"
  },
  
  swipeIt: function(e){
      if (e.direction == 'right') {
           console.log("You swiped right");
      }
      else if (e.direction == 'left') {
          console.log("You swiped left");
      }
  }
  
  });
  
  var view = new View({ el: $("#container") });
  </code></pre>
  
  <p>Unfortunately when I swipe the square nothing is displayed in the console. Anyone had a similar issue?</p>