HTML | DOM TouchEvent targetTouches Property
The TouchEvent targetTouches property is a read-only property and used for returning an array of Touch objects. It returns one object for each finger that is touching the current target element.
Syntax :
event.targetTouches
Below program illustrates the TouchEvent targetTouches property :
Example: Finding out the number of fingers that touch an element.
<!DOCTYPE html><html><meta name="viewport" content="width=device-width, initial-scale=1"> <head> <title> TouchEvent targetTouches property in HTML </title> <style> #samplediv { border: 1px solid green; } h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </style></head> <body ontouchstart="countTouches(event)" ontouchend="countTouches(event)"> <h1>GeeksforGeeks</h1> <h2> TouchEvent targetTouches property </h2> <br> <p>The current element is touched by <span id="touch">0</span> fingers.</p> <script> function countTouches(event) { // Returning touched target. var t = event.targetTouches.length; document.getElementById("touch").innerHTML = t; } </script> </body> </html> |
Output:
After touching the screen:
After touching the screen:
Supported Browsers:
- Opera
- Internet Explorer
- Google Chrome
- Firefox
- Apple Safari
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML course.
