Vertical Pan Hammer.js example

What is a vertical pan hammer.js example How do you make a vertical pan hammer.js example? This script and codes were developed by Jorik Tangelder on 16 October 2021, Saturday.

How do I make an vertical pan hammer.js example?
  1. Vertical Pan Hammer.js example Previews
  2. Vertical Pan Hammer.js example HTML Codes
  3. Vertical Pan Hammer.js example CSS Codes
  4. Vertical Pan Hammer.js example JS Codes
Vertical Pan Hammer.js example Previews

Vertical Pan Hammer.js example HTML Codes

<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>Vertical Pan Hammer.js example</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>
  <script src="https://hammerjs.github.io/dist/hammer.js"></script>

<div id="myElement"></div>
  
    <script src="js/index.js"></script>

</body>
</html>

Vertical Pan Hammer.js example CSS Codes

#myElement {
  background: silver;
  height: 300px;
  text-align: center;
  font: 30px/300px Helvetica, Arial, sans-serif;
}

Vertical Pan Hammer.js example JS Codes

var myElement = document.getElementById('myElement');

// create a simple instance
// by default, it only adds horizontal recognizers
var mc = new Hammer(myElement);

// let the pan gesture support all directions.
// this will block the vertical scrolling on a touch-device while on the element
mc.get('pan').set({ direction: Hammer.DIRECTION_ALL });

// listen to events...
mc.on("panleft panright panup pandown tap press", function(ev) {
    myElement.textContent = ev.type +" gesture detected.";
});
Do you want hide your ip address?Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup.