# jquery.hammer.js

# Touch me

The tap event will be fired. Notice in the sourcecode that event delegation is also supported.
In the console you can see the event data.

#### List items with stopPropagation

- List item 1
- List item 2
- List item 3
- List item 4
- List item 5

Add list item

    var hammertime = $(".toucharea").hammer();

    // the whole area
    hammertime.on("touch", function(ev) {
      $(this).highlight();
    });

    // on elements in the toucharea, with a stopPropagation
    hammertime.on("touch", "li", function(ev) {
      $(this).highlight();
      ev.stopPropagation();
    });

    // on dynamic items
    $("#add-list-item").on("touch", function(ev) {
      $("#items").append("<li>Dynamic added listitem</li>");
      ev.gesture.preventDefault();
      ev.stopPropagation();
    });

    // simple helper function
    $.fn.highlight = function(options) {
      options = $.extend({},{
        className: 'highlight',
        delay: 100
      }, options);

      return this.each(function(){
        (function(elem, cName, time){
          setTimeout(function() {
            elem.removeClass(cName);
          }, time);
          elem.addClass(cName);
        })($(this), options.className, options.delay);
      });
    }