Categories
JavaScript Answers

How to detect a pinch with JavaScript?

Spread the love

Sometimes, we want to detect a pinch with JavaScript.

In this article, we’ll look at how to detect a pinch with JavaScript.

How to detect a pinch with JavaScript?

To detect a pinch with JavaScript, we listen to the gestureend event.

For instance, we write

node.addEventListener(
  "gestureend",
  (e) => {
    if (e.scale < 1.0) {
      //...
    } else if (e.scale > 1.0) {
      //...
    }
  },
  false
);

to listen to the gestureend event with addEventListener.

In it, we check the e.scale value.

If it’s less than 1, then the we moved our fingers closers together.

Otherwise, we moved our fingers farther apart.

Conclusion

To detect a pinch with JavaScript, we listen to the gestureend event.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *