Untitled

<!DOCTYPE html>
<html>

  <head>
    <script data-require="hammer.js@2.0.4" data-semver="2.0.4" src="//cdn.jsdelivr.net/hammerjs/2.0.4/hammer.js"></script>
    <link rel="stylesheet" href="style.css" />
  </head>

  <body>
    <div id="mydiv">
      <p id="myp">Text</p>
    </div>
    <script src="script.js"></script>
  </body>
</html>

var div = document.getElementById("mydiv");
var p = document.getElementById("myp");

var hammer = new Hammer(div);

hammer.get("press").set({time: 1000});

hammer.on("press", function(event) {
  p.innerHTML = event.type;
});

hammer.on("tap", function(event) {
  p.innerHTML = event.type;
});

hammer.on("hammer.input", function (event) {
  event.preventDefault();
});

/* Styles go here */
div {
  width: 400px;
  height: 400px;
  background-color:black;
  text-align: center;
}

p {
  color: white;
}