The TouchEvent.changedTouches read-only property which is a TouchList. TouchList representing each touchpoint directly involved in this event:
touchstart: A list of touchpoints that become active in touchstart event.
touchmove: A list of touchpoints that have moved during touchmove event.
touchend: A list of touchpoints that become deactivate in touchend event.
touchenter: A list of touchpoints that have entered the touch surface during touchenter event.
touchleave: A list of touchpoints that have exited the touch surface during touchleave event.
Syntax:
var touches = touchEvent.targetTouches;
Return value: A TouchList listing is returned all the Touch objects for the touchpoints which are still in contact with the surface of the Touch and whose touchstart event occurred inside the same target element like the current target element.
Example 1:
javascript
<!DOCTYPE html>
<html>
<head>
<title>
TouchEvent.changedTouches
</title>
</head>
<body>
<center>
<div class="classdiv" id="divID">
<h3> Touch Me! </h3>
</div>
<h3 id="statusdiv">Status</h3>
</center>
</body>
<script>
window.addEventListener( 'load' , function (){
var divID = document.getElementById( 'divID' )
var statusdiv = document.getElementById( 'statusdiv' )
var startx = 0
var dist = 0
divID.addEventListener( 'touchstart' , function (e){
var touchobj = e.changedTouches[0]
startx = parseInt(touchobj.clientX)
statusdiv.innerHTML = 'Status: touchstart<br> ClientX: ' + startx + 'px'
e.preventDefault()
}, false )
}, false )
</script>
</html>
|
Output:
Before touch:
After touch:
Supported Browsers: The browsers supported by TouchEvent.changedTouches are listed below:
- Google Chrome 22
- Firefox 52
- Edge 79
- Opera 15
Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape,
GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out -
check it out now!
Last Updated :
13 Jun, 2022
Like Article
Save Article