Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Prevent event from bubbling up for children elements with individual hammer instances #47

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

lfre
Copy link

@lfre lfre commented May 2, 2016

This handles the scenario when there's a parent hammer instance delegating events, and a chid with another hammer instance triggers a parent's delegated event with the child's data. For example:

<div class="container">
       <div class="inner-container">
              <img />
      </div>
  </div>

Setup:

  • container div, initiates a hammer instance with domEvents: true.
  • container div delegates an event ( panstart ) to inner-container
  • image element initiates another hammer instance with different recognizers/options and domEvents false and has a panstart handler as well.

Steps:

  1. When the target is the image element, first the image handler will fire because of the event delegation in the parent, that is expected and can be prevented by checking for the originalEvent property in the handler, or creating a hammer instance without the plugin.
  2. Then, the delegated event for inner-container will fire, and the expected handler for the image with its individual data options will fire next.
  3. Because of trigger, when the image is this.element will also fire the delegated event on inner-container with the image data options. triggerHandler will only affect the first matched element and will not bubble up the DOM hierarchy.

This is useful for plugin-like functionality when a file wants to bind hammer events to elements, but in a specific context the element might already have a parent with a delegating hammer instance.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant