Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <script src="//cdn.jsdelivr.net/hammerjs/2.0.4/hammer.js"></script>
  <style>
    #child {
      width: 200px;
      height: 200px;
      background: lightgreen;
    }
  </style>
</head>
<body>
  <p>See the browser console. Why does the tap event of the parent div fire first?</p>
<div id="parent">
  <div id="child">click here</div>
</div>
<script>
  var hammerParent = new Hammer(document.getElementById('parent'));
  var hammerChild = new Hammer(document.getElementById('child'));
  hammerParent.on('tap', function (event) {
    console.log('tap parent');
  });
  hammerChild.on('tap', function (event) {
    console.log('tap child');
  });
</script>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
josdejongpro
0viewers